<!-- 
 * {
        margin:0;
        padding:0;
    }
html, body {
    height:100%;
	background:url(../img/binary-background.jpg);
/*	overflow:hidden;*/
}

p {
    padding:1em 0 0 2em;
}

h1 {
    padding: 1.0em 0 0 1em;
    color: #0000FF;
}
h2 {
    padding: 1.0em 0 0 1.25em;
}
h3 {
    padding: 1.0em 0 0 1.5em;
}
h4 {
    padding: 1.0em 0 0 1.75em;
}
h5 {
    padding: 1.0em 0 0 1.75em;
}

/* class="indented" - to indent a paragraph or table entry*/
.indented {
    padding-left: 4em;;
}

/* DL, DT, DD TAGS LIST DATA */
dl {
    margin-bottom:0px;
}
 
dl dt {
    float:left;
    font-weight:bold;
    margin-right:10px;
    padding:5px;
    width:50px;
}
 
dl dd {
    margin:2px 0;
    padding:5px 0;
}

/* UL, LI TAGS LIST DATA */
ul {
   list-style-type: bullet;
   padding: 1em 0 0 4em;
   /*padding: 30em 10em 20em 40em;*/
   /*line-height: 1.5em;*/
}

.sl{
    list-style-type: none;
}

ol {
   padding: 1em 0 0 4em;
   /*padding: 30em 10em 20em 40em;*/
   /*line-height: 1.5em;*/
}

li {
   padding: 0em 0em 0em 0em;
}
.li-margin {
   padding: 1em 0em 0em 0em;
}

table {
    padding:1em 0 0 0em;
}
.table-indent {
    padding-left: 1.5em;
    border-spacing: 10px;
    cell-spacing
}
.table-indent p {
    padding:1em 0 0 0em;
}

td {			/*Reminder: larger cell width defined individually in source - e.g. d11-01.php */
    vertical-align: top;			
}
.td-bold {
    font-weight:bold;
    width: 200px;
}

#small{
    font-size: x-small;
}

#banner {
    min-height: 130px;
    height: 17%;
    top: 0px;
}

#bannerImage {
	top: 0px;
	height: 70px;
	background-image: url(../img/IBM_Logos.jpg); 
	background-repeat: repeat-x; 
	background-position: center;">
	background-size: contain;  
}

#table {
	float:left;
	width:60%;
	position:relative;
	overflow:auto;
/*	background:url(../images/clouds3.jpg) center; */ 
/*	height:83%; */
}

#search {
	float:left;
	width:40%;
	position:relative;
	overflow:auto;
/*	background:url(../images/clouds3.jpg) center; */
/*	height:100%; */
}
#button-search {
	background-color: #4CAF50;
	color: white;
	font-size: 16px;
	width: 250px;
	padding: 14px 40px;
}
input[type=submit]{
    		width: 50%;
    		background-color: #04AA6D;
  			border: none;
  			color: white;
  			font-size: 16px;
  			padding: 12px 28px;
  			text-decoration: none;
  			margin: 4px 2px;
  			cursor: pointer;
}

#loader {
  background: lightgray;
  justify-content: flex-start;
  border-radius: 100px;
  align-items: center;
  position: relative;
  padding: 0 5px;
  display: flex;
  height: 40px;
  /*width: 500px;*/
}

.loader-value {
  animation: load 120s normal forwards;
  box-shadow: 0 10px 40px -10px #fff;
  border-radius: 100px;
  background: green;
  height: 30px;
  width: 0;
}

@keyframes load {
  0% { width: 0; }
  100% { width: 100%; }
}

#myDiv {
  display: none;
}

#pagelist {
	/*background: beige;*/
	width: 99%;
	overflow-wrap: break-word;
	white-space: pre-wrap;
}

.selectInputBox {
    padding: 10px;
    border: #dedede 1px solid;
    border-radius: 3px;
    width: 200px;
    margin-top: 5px;
}

#div_indent {
	padding-left:25px;
}

.box {
    border: 1px solid black;
	display: block;
	color: blue;
	padding: 5px;
	/*background: gray;*/
}
.boxbox {
    border: 1px solid black;
	display: block;
	color: blue;
	padding: 5px;
	/*background: gray;*/
}
.boxOut {
	display:none;
	position: absolute;
    width: 270px;
    left: 95%;
	border: 1px solid blue;
	opacity: 1.0;
	color: black;
  	/*background: gray;*/ 
  	/*background-color: yellow;*/
  	/*background-origin:border-box;*/ 
  	z-index:1;	
}
.boxOutOut {
	display:none;
	position: absolute;
    width: 400px;
    left: 95%;
	border: 1px solid blue;
	opacity: 1.0;
	color: black;
  	/*background: white;*/ 
  	/*background-color: white;*/
  	/*background-origin:border-box;*/ 
  	z-index:1;	
}
.boxOut-2 {
	display:none;
	position: absolute;
    width: 300px;
    left: 97.5%;
	border: 1px solid blue;
	opacity: 1.0;
	color: black;
  	/*background-origin:border-box;*/ 
  	z-index:2;	
}

.box:hover .boxOut{
	display:block;
}
.boxbox:hover .boxOutOut{
	display:block;
}

.field-1 {
	/*background: beige;*/
}
.field-2 {
	background: ghostwhite;
	padding: 5px;
	border: 1px solid blue;
  	min-height: 100%
}
.field-2:hover .boxOut-2 {
	display:block
}
.field-3 {
	background: ghostwhite;
	padding: 5px;
	border: 1px solid blue;
}
.field-4 {
	/*background: gray;*/
	/*padding: 5px;*/
	border: 1px solid blue;
  	height: 0.1px;
}
#navi {
	position: relative;
	float:left;
	width:15%;
	min-width: 120px;
	height:83%;
	z-index: 1;
}
#content {
	float:left;
	position:relative;
	width:85%;
	overflow:auto;
	height:83%;
	z-index: 0;
}

#lightbox{
	background-color:#eee;
	padding: 10px;
	border-bottom: 2px solid #666;
	border-right: 2px solid #666;
	}
#lightboxDetails{
	font-size: 0.8em;
	padding-top: 0.4em;
	}
#lightboxCaption{ float: left; }
#keyboardMsg{ float: right; }

#lightbox img{ border: none; }
#overlay img{ border: none; }
#closeButton{ top: 5px; right: 5px; }
-->