table {
    border-collapse: collapse;
    table-layout: fixed;
    margin: 0;
    border-right: 0;
    padding: 0;

}
/* set table to 100% on screens smaller than default size
so it will resize properly */
@media only screen and (max-width: 360px) {
    table {width: 100%;}
	table p {font-size: 12px !important;}
}
@media only screen and (max-width: 300px) {
    table p {font-size: 10px !important;}
	.period { width:28px;}
}     
table p {
  /* top , sides */
  margin: 14px 0;
  padding: 0;
  border: 0;
  font: 14px HelveticaNeue, 'Helvetica Neue', Helvetica, Arial, sans-serif;
  /*  line-height: 100%; */
}
th, td {
    border: 1px solid grey;
    border-width: thin;
    color: #55606E;
}
th {
  font-weight: bold;
}
.period {
  width:40px;
  /* word-wrap: break-word; */
}
.thick {
  width: 66px;
  word-break: break-word;
  word-wrap: break-word; /* unsupported in most browsers, use word-break */
  overflow: visible;
}
.lith {
  width: 38px;
  border-right:none;
  background-repeat: repeat-y;
  overflow: visible;
}
.notes {
  font: italic 8px 'Open Sans', HelveticaNeue, 'Helvetica Neue', Helvetica, Arial, sans-serif;
  max-width:100px;
  overflow: visible;
  border: 0;
}

.stext {
  text-align:center;
}

.strat-heading {
  text-align:center;
  font-weight: bold;
}

.prd-hdr {
  width: 45px;
  font-size: 12px;
}
.fm-hdr {
  min-width: 120px;
}
.thck-hdr {
}
.lith-hdr {
border-right:1px solid grey;
}


.time-img {
  background-position: center center;
  white-space: nowrap;
  overflow: hidden;
  opacity: 0.7;

   /* Hide the text. 
   text-indent: 120%;
  white-space: nowrap;
  overflow: hidden;
  */
  /* until I finish hide the time images   
  background: url("utahgeo/strat/times/transparent.png") no-repeat center !important;
 */
}
.time-img p {
      /* transform-origin: 0 0; */
      transform: rotate(-90deg);
      /* text-transform: uppercase; */
      font-family: Georgia, serif;
	  /* font-size: 115%;  */
      font-weight: bold;
      color: black;
      width: 30px;
	  margin: 0;
	  /* img isn't centered so we add this to push it right */
	  margin-left: 15%;
}

/* ICS background colors */
.Q-color, .Q1-color {
  background-color: #fff799;
}
.Q2-color {
  background-color: #fff720;
}
.Ne-color {
  background-color: #fcb186;
}
.Pl-color, .T5-color {
  background-color: #FFFAD2;
}
.Mi-color, .T4-color {
  background-color: #FDF286;
}
.Ol-color, .T3-color {
  background-color: #FEDFB3;
}
.Eo-color, .T2-color {
  background-color: #FEBF89;
}
.Pg-color, .T1-color {
  background-color: #fcbd86;
}
.T-color {
  background-color: #FEDFB3;
}
.K-color {
  background-color: #87c76e;
}
.J-color {
  background-color: #00b8e5;
}
.Tr-color {
  background-color: #bb9dca;
}
.P-color {
  background-color: #f8b3a3;
}
.Ca-color {
  background-color: #66adb2;
}
.PP-color {
  background-color: #9bbab2;
}
.M-color {
  background-color: #8da871;
}
.D-color {
  background-color: #f1ca84;
}
.S-color {
  background-color: #b2dec9;
}
.O-color {
  background-color: #39ba9d;
}
.C-color {
  background-color: #8cab78;
}
.pC-color {
  background-color: #f05a78;
}
.Pz-color {
  background-color: #f1859b;
}
.ptext {
  display:none;
}



/* These are period images for macrostat columns
instead of using text & background colors, they
use imgs.  looks a bit better? */

.notes {
  font: italic 9px 'Open Sans', HelveticaNeue, 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
.time-img {
  background-position: center center;
  white-space: nowrap;
  overflow: hidden;
  opacity: 0.7;
}
.Quaternary {
  background: url("utahgeo/strat/times/quaternary.png") no-repeat center;
  background-color: #fff799;
}
.Pleistocene {
  background: url("utahgeo/strat/times/pleistocene.png") no-repeat center;
  background-color: #fff0bd;
}
.Pliocene {
  background: url("utahgeo/strat/times/pliocene.png") no-repeat center;
  background-color: #f0e891;;
}
.Miocene {
  background: url("utahgeo/strat/times/miocene.png") no-repeat center;
  background-color: #fff200;
}
.Oligocene {
  background: url("utahgeo/strat/times/oligocene.png") no-repeat center;
  background-color: #ffcd98;
}
.Eocene{
  background: url("utahgeo/strat/times/eocene.png") no-repeat center;
  background-color: #fcbc86;
}
.Paleocene {
  background: url("utahgeo/strat/times/paleocene.png") no-repeat center;
  background-color: #fbb37b;
}
.Neogene {
  background: url("utahgeo/strat/times/neogene.png") no-repeat center;
  background-color: #ffd41e;
}
.Paleogene {
  background: url("utahgeo/strat/times/paleogene.png") no-repeat center;
  background-color: #fcbd86;
}
.Cretaceous {
  background: url("utahgeo/strat/times/cretaceous.png") no-repeat center;
  background-color: #87c76e;
}
.Jurassic {
  background: url("utahgeo/strat/times/jurassic.png") no-repeat center;
  background-color: #00b8e5;
}
.Triassic {
  background: url("utahgeo/strat/times/triassic.png") no-repeat center;
  background-color: #bb9dca;
}
.Permian {
  background: url("utahgeo/strat/times/permian.png") no-repeat center;
  background-color: #f8b3a3;
}
.Carboniferous {
  background: url("utahgeo/strat/times/carboniferous.png") no-repeat center;
  background-color: #66adb2;
}
.Pennsylvanian {
  background: url("utahgeo/strat/times/pennsylvanian.png") no-repeat center;
  background-color: #9bbab2;
}
.Mississippian {
  background: url("utahgeo/strat/times/mississippian.png") no-repeat center;
  background-color: #8da871;
}
.Devonian {
  background: url("utahgeo/strat/times/devonian.png") no-repeat center;
  background-color: #f1ca84;
}
.Silurian {
  background: url("utahgeo/strat/times/silurian.png") no-repeat center;
  background-color: #b2dec9;
}
.Ordovician {
  background: url("utahgeo/strat/times/ordovician.png") no-repeat center;
  background-color: #39ba9d;
} 
.Cambrian {
  background: url("utahgeo/strat/times/cambrian.png") no-repeat center;
  background-color: #8cab78;
}
.preCambrian {
  background: url("utahgeo/strat/times/precambrian.png") no-repeat center;
  background-color: #ff3fb3;
}
.Proterozoic {
  background: url("utahgeo/strat/times/proterozoic.png") no-repeat center;
  background-color: #f05a78;
}
.Archean {
  background: url("utahgeo/strat/times/archean.png") no-repeat center;
  background-color: #bd6073;
}


/* short images for small spaces */
.Quaternary-short {
  background: url("utahgeo/strat/times/quaternary-short.png") no-repeat center;
  background-color: #fff799;
}
.Pleistocene-short {
  background: url("utahgeo/strat/times/pleistocene-short.png") no-repeat center;
  background-color: #fff0bd;
}
.Pliocene-short {
  background: url("utahgeo/strat/times/pliocene-short.png") no-repeat center;
  background-color: #f0e891;
}
.Miocene-short {
  background: url("utahgeo/strat/times/miocene-short.png") no-repeat center;
  background-color: #fff200;
  }
.Oligocene-short {
  background: url("utahgeo/strat/times/oligocene-short.png") no-repeat center;
  background-color: #ffcd98;
}
.Eocene-short {
  background: url("utahgeo/strat/times/eocene-short.png") no-repeat center;
  background-color: #fcbc86;
}
.Paleocene-short{
  background: url("utahgeo/strat/times/paleocene-short.png") no-repeat center;
  background-color: #fbb37b;
}
.Neogene-short {
  background: url("utahgeo/strat/times/neogene-short.png") no-repeat center;
  background-color: #ffd41e;
}
.Paleogene-short {
  background: url("utahgeo/strat/times/paleogene-short.png") no-repeat center;
  background-color: #fcbd86;
}
.Cretaceous-short {
  background: url("utahgeo/strat/times/cretaceous-short.png") no-repeat center;
  background-color: #87c76e;
}
.Jurassic-short {
  background: url("utahgeo/strat/times/jurassic-short.png") no-repeat center;
  background-color: #00b8e5;
}
.Triassic-short {
  background: url("utahgeo/strat/times/triassic-short.png") no-repeat center;
  background-color: #bb9dca;
}
.Permian-short {
  background: url("utahgeo/strat/times/permian-short.png") no-repeat center;
  background-color: #f8b3a3;
}
.Carboniferous-short {
  background: url("utahgeo/strat/times/carboniferous-short.png") no-repeat center;
  background-color: #66adb2;
}
.Pennsylvanian-short {
  background: url("utahgeo/strat/times/pennsylvanian-short.png") no-repeat center;
  background-color: #9bbab2;
}
.Mississippian-short {
  background: url("utahgeo/strat/times/mississippian-short.png") no-repeat center;
  background-color: #8da871;
}
.Devonian-short {
  background: url("utahgeo/strat/times/devonian-short.png") no-repeat center;
  background-color: #f1ca84;
}
.Silurian-short {
  background: url("utahgeo/strat/times/silurian-short.png") no-repeat center;
  background-color: #b2dec9;
}
.Ordovician-short {
  background: url("utahgeo/strat/times/ordovician-short.png") no-repeat center;
  background-color: #39ba9d;
}
.Cambrian-short {
  background: url("utahgeo/strat/times/cambrian-short.png") no-repeat center;
  background-color: #8cab78;
}
.preCambrian-short {
  background: url("utahgeo/strat/times/precambrian-short.png") no-repeat center;
  background-color: #ff3fb3;
}
.Proterozoic-short {
  background: url("utahgeo/strat/times/proterozoic-short.png") no-repeat center;
  background-color: #f05a78;
}
.Archean-short{
  background: url("utahgeo/strat/times/archean-short.png") no-repeat center;
  background-color: #bd6073;
}


/* long images for big spaces */
.Quaternary-long {
  background: url("utahgeo/strat/times/quaternary-long.png") no-repeat center;
  background-color: #fff799;
}
.Pleistocene-long{
  background: url("utahgeo/strat/times/pleistocene-long.png") no-repeat center;
  background-color: #fff0bd;
}
.Pliocene-long {
  background: url("utahgeo/strat/times/pliocene-long.png") no-repeat center;
  background-color: #f0e891;
}
.Miocene-long{
  background: url("utahgeo/strat/times/miocene-long.png") no-repeat center;
  background-color: #fff200;
  }
.Oligocene-long {
  background: url("utahgeo/strat/times/oligocene-long.png") no-repeat center;
  background-color: #ffcd98;
}
.Eocene-long{
  background: url("utahgeo/strat/times/eocene-long.png") no-repeat center;
  background-color: #fcbc86;
}
.Neogene-long {
  background: url("utahgeo/strat/times/neogene-long.png") no-repeat center;
  background-color: #ffd41e;
}
.Paleogene-long {
  background: url("utahgeo/strat/times/paleogene-long.png") no-repeat center;
  background-color: #fcbd86;
}
.Paleocene-long{
  background: url("utahgeo/strat/times/paleocene-long.png") no-repeat center;
  background-color: #fbb37b;
}
.Cretaceous-long {
  background: url("utahgeo/strat/times/cretaceous-long.png") no-repeat center;
  background-color: #87c76e;
}
.Jurassic-long {
  background: url("utahgeo/strat/times/jurassic-long.png") no-repeat center;
  background-color: #00b8e5;
}
.Triassic-long {
  background: url("utahgeo/strat/times/triassic-long.png") no-repeat center;
  background-color: #bb9dca;
}
.Permian-long {
  background: url("utahgeo/strat/times/permian-long.png") no-repeat center;
  background-color: #f8b3a3;
}
.Carboniferous-long {
  background: url("utahgeo/strat/times/carboniferous-long.png") no-repeat center;
  background-color: #66adb2;
}
.Pennsylvanian-long {
  background: url("utahgeo/strat/times/pennsylvanian-long.png") no-repeat center;
  background-color: #9bbab2;
}
.Mississippian-long {
  background: url("utahgeo/strat/times/mississippian-long.png") no-repeat center;
  background-color: #8da871;
}
.Devonian-long {
  background: url("utahgeo/strat/times/devonian-long.png") no-repeat center;
  background-color: #f1ca84;
}
.Silurian-long {
  background: url("utahgeo/strat/times/silurian-long.png") no-repeat center;
  background-color: #b2dec9;
}
.Ordovician-long {
  background: url("utahgeo/strat/times/ordovician-long.png") no-repeat center;
  background-color: #39ba9d;
}
.Cambrian-long {
  background: url("utahgeo/strat/times/cambrian-long.png") no-repeat center;
  background-color: #8cab78;
}
.preCambrian-long {
  background: url("utahgeo/strat/times/precambrian-long.png") no-repeat center;
  background-color: #ff3fb3;
}
.Proterozoic-long {
  background: url("utahgeo/strat/times/proterozoic-long.png") no-repeat center;
  background-color: #f05a78;
}
.Archean-long{
  background: url("utahgeo/strat/times/archean-long.png") no-repeat center;
  background-color: #bd6073;
}

.stratbtn {
  background-color: #008CBA;
  border: none;
  color: white;
  padding: 6px 8px;
  margin: 4px 2px;
  text-align: center;
  text-decoration: none;
  display: inline;
  font-size: 13px;
}