
/* some general styles */
* {
    box-sizing: border-box;
}

body{
    font: 14px "calibri";
}

/* grid layout for the header */
.HEADER {
    width: 100%;
    margin-bottom: 1em;
    display: grid;
    grid-template-columns: 80% 20%;
    grid-gap: 0;
    grid-auto-rows: minmax(0, auto);
    page-break-after: always;
}

.HEADSCREENSHOT {
    grid-column: 1 / span 2;
    grid-row: 2;
    position: relative;
    margin: auto;
    padding:16px;
    text-align: center;
    vertical-align:middle;
}

.HEADSCREENSHOT .slideImage {
    display: none;
    min-height:400px;
    max-height:400px;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: gray;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "prev button" to the left */
.prev {
  left: 0;
}


/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(100,200,100,0.8);
}


.LOGO {
    grid-column: 2 / span 1;
    grid-row: 1;
    text-align: right;
}

.LOGO > img {
	padding:0.5em;
    max-width: 100%;
    //max-height: 100%;
}

.HEADINFOTEXT {
    grid-column: 1 / span 1;
    grid-row: 1;
}


/* flex header styles */
.flexContainer{
    display:flex;
    flex-flow:row wrap;    
}

.flexItem
{
    display:flex;
    margin:-.5px 0px;
    font-size: 14px;
}

.flexCellName{
    border: 1px solid green;
    border-right:0;
    font-weight: bold;
    padding:2px;
}
.flexCellName:after{
    content:":";
}

.flexCellName:empty, .flexCellValue:empty{
    display:none;
}

.flexCellValue{
    border: 1px solid green;
    border-left:0;
    padding:2px;
}

.showOnPrint{
    display:none;
    max-width:50%;
    margin:auto;
}

 /* do not print image navigation */
@media print
{     
    .prev, .next
    {
        display: none !important;
    }
    .showOnPrint{
        display:initial !important;
    }
    
    .slideImage{
        display:none !important;
    }
    .slideImage:first-child{
        display:block !important;
    }
}


/* hide the original header info table */
.HEADINFOTEXT_TABLE {
    display:none;
}


.COMMENT {
    grid-column: 1 / span 2;
    grid-row: 3 / span 1;
}
.COMMENT_NAME{
   font-weight: bold;
   border-bottom: 1px solid;
}
.COMMENT p {
	margin:0;
}



/* content container <div> - general format */
.CONTENT{
	padding-top:10px;
}

/* tool bitmaps */
.CONTENT img
{
	max-width:96px;
	max-height:96px;
}


/* table content <table> - general table format of content */
.CONTENT_TABLE{
	width:100%;
	font: 14px "calibri";
	text-align: left;
	margin-right:5px;
	margin-bottom:5px;
	border:1px solid black;
	border-collapse: collapse
}


/* content caption - align at bottom */
.CONTENT_TABLE caption
{
	font: 18px "calibri";
	font-weight:bold;
	padding:5px;
}

.CONTENT_TABLE caption:before{
    content:"TOOLING LIST";
}

/* content cell <td> - general format of content cells */
.CONTENT_TABLE td{
	padding:0 3px;
	border:1px solid black;
}

/* content head <th> - column heading */
.CONTENT_TABLE th{
	text-align: center;
	padding:0 3px;
	border:1px solid black;
}

/* foot note <tfoot> - overall cycle time */
.CONTENT_TABLE tfoot{
	display:none;
}

/* content column <td> - center numbers */
.td_100, 
.td_112, 
.td_108, 
.td_102,
.td_103,
.td_109,
.td_114, 
.td_120,
.td_24,
.td_116,
.td_101,
.td_127,
.td_137
{
	text-align:center;
}