@charset "UTF-8";

  body {
    background-color: #efefef;
  }

  #container {
  display: grid;
  box-sizing: border-box;
  padding: 30px;
  grid-template-columns: repeat(6, 1fr);
  grid-template-rows: 15% auto 20% 20%;
  grid-gap: 16px;
  width: 800px;
  height: 800px;
  margin: 100px auto 25px auto;
  background-color: #fff;
}

#container>* {
  display: flex;
  font-family: Arial, serif;
  /*font-size: 11px; original */

  font-size: 12px; /*12px = 9pt*/

  /*line-height: 12px; */
  /*color: #333; */
  color: black;
  flex-direction: column;
}

.smallCap{
  font-variant: small-caps;
}

#columnLeft, #columnRight{
  display: grid;
  grid-gap: 16px;
}

#columnLeft{
  grid-template-rows: 15% auto 30% auto;

  grid-column: 1/3;
  grid-row: 1/5;
}

#columnLeft>*{
  text-align: right;
}

#columnRight>*{
}

#colLeft1, #colLeft2, #colLeft4{
  line-height: 14.4px; /*10.8pt = 14.4px*/

}

#colLeft3{
  line-height: 21.3px; /*16pt = 21.3px*/
}

#columnRight{
  grid-template-rows: 15% 32% auto 23.5%;

  grid-column: 3/7;
  grid-row: 1/5;
}

#colRight2{
  display: grid;
  grid-template-columns: 12% 10% auto;
  grid-gap: 10px;

  line-height: 17px; /*17px = 13pt*/
}



#colRight2>*{

}

#colRight3{
  line-height: 15.33px; /*15.3repeating = 11.5 pt*/
}

#info {
  font-family: Helvetica, sans-serif;
  font-size: 12px;
  line-height: 15px;
  color: #555;
  width: 800px;
  margin: 0 auto 100px auto;
}

.tabbed{
  margin-left: 11%;
}

/*
#container>#nutrition-info {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 13px 35px auto;
}

#container>#nutrition-info>#dv {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto;
  line-height: 18px;
}

#container>#nutrition-info>#dv>#right {
  text-align: right;
}


} */