.topmenu {
  position: fixed;
  top: 10px;
  left:130px;
  width: 100%;
  height: 100px;
  color: black;
  font-size:30px;
}
.topmenu21 {
  position: fixed;
  top:  50px;
  left: 140px;
  color: #2980B9;
  font-size:16px;
}
.topmenu22 {
  position: fixed;
  top: 60px;
  left: 480px;
  color: #2980B9;
  font-size:16px;
}
.topmenu23 { /* eStat QR */
  position: fixed;
  top:60px;
  left:700px;
  color: #4CAF50;
}
.leftmenu {
  position: fixed;
  top: 60px;
  width: 100px;
}
.main {
  position: fixed;
  left:120px;
  top:135px;
/*  width:  800px; */
  height: 600px; /* Used in this example to enable scrolling */
  padding: 10px;
  border: 1px solid #ccc;
  overflow: scroll;
}
.mainTable {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  border: collapse;
  width: 100%;
  background-color: white;
  text-align: left;
  padding: 5px;
}
.mainTableGrey {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  border: collapse;
  width: 100%;
  background-color: #f2f2f2;
  text-align: left;
  padding: 5px;
}
.mainTableYellow {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  border: collapse;
  width: 100%;
  background-color: lightyellow;
  text-align: left;
  padding: 5px;
  color: blue;
}
.mainTablePink {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  border: collapse;
  width: 100%;
  background-color: #ffe6e6;
  text-align: left;
  padding: 5px;
}
.mainLeft {
  border: 1px solid #ddd;
  padding: 10px;
  width: 120px;
  text-align: center;
}
.mainRight {
  border: 1px solid #ddd;
  padding: 10px;
}
.mainRightN {  /* no border */
  padding-left: 10px;
  padding-right: 10px;
}
.qrBtn {
  background-color: #4CAF50; /* green */
  color: white;
  padding: 3px;
  font-size: 7px;
  border: none;
  cursor: pointer;
  height: 110px;
  width : 110px ;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgIcon {
  color: white;
  padding: 3px;
  border: none;
  height: 50px;
  width : 50px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgFig600600 { /* border 600 by 600 eStatU Graph*/
  color: white;
  padding: 3px;
  border: 1px solid black; 
  width : 600px;
  height: 600px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgFig600540 { /* border 600 by 560 eStat Graph*/
  color: white;
  padding: 3px;
  border: 1px solid black; 
  width : 600px;
  height: 560px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgFig600400N { /* no border 600 by 400 */
  color: white;
  padding: 3px;
  border: none; 
  width : 600px;
  height: 400px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgFig600400 { /* border 600 by 400 eStatU*/
  color: white;
  padding: 3px;
  border: 1px solid black; 
  width : 600px;
  height: 400px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgFig600300 { /* border 600 by 300 */
  color: white;
  padding: 3px;
  border: 1px solid black; 
  width : 600px;
  height: 300px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgFig600200 { /* border 600 by 200 eStat Graph*/
  color: white;
  padding: 3px;
  border: 1px solid black; 
  width : 600px;
  height: 200px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgFig500500 { /* border 500 by 500 */
  color: white;
  padding: 3px;
  border: 1px solid black;
  width : 500px;
  height: 500px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgFig500300 { /* border 500 by 300 */
  color: white;
  padding: 3px;
  border: 1px solid black;
  width : 500px;
  height: 300px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgFig500200 { /* border 500 by 200 */
  color: white;
  padding: 3px;
  border: 1px solid black;
  width : 500px;
  height: 200px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgFig500100 { /* border 500 by 100 */
  color: white;
  padding: 3px;
  border: 1px solid black;
  width : 500px;
  height: 100px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgFig400300 { /* border 400 by 300 */
  color: white;
  padding: 3px;
  border: 1px solid black; 
  width : 400px;
  height: 300px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgFig400100 { /* border 400 by 100 */
  color: white;
  padding: 3px;
  border: 1px solid black;
  width : 400px;
  height: 100px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgFig40070 { /* border 400 by 70 */
  color: white;
  padding: 3px;
  border: 1px solid black;
  width : 400px;
  height: 70px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgFig300400 { /* border 300 by 400 */
  color: white;
  padding: 3px;
  border: 1px solid black;
  width : 300px;
  height: 400px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgFig300300 { /* border 300 by 300 */
  color: white;
  padding: 3px;
  border: 1px solid black;
  width : 300px;
  height: 300px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgFig300250 { /* border 300 by 250 */
  color: white;
  padding: 3px;
  border: 1px solid black;
  width : 300px;
  height: 250px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgFig300200 { /* border 300 by 200 */
  color: white;
  padding: 3px;
  border: 1px solid black;
  width : 300px;
  height: 200px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgFig300100 { /* border 300 by 100 */
  color: white;
  padding: 3px;
  border: 1px solid black;
  width : 300px;
  height: 100px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgFig30050 { /* border 300 by 50 */
  color: white;
  padding: 3px;
  border: 1px solid black;
  width : 300px;
  height: 50px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgFig200100 { /* border 200 by 100 */
  color: white;
  padding: 3px;
  border: 1px solid black;
  width : 200px;
  height: 100px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgFig150200 { /* no border 150 by 200 table */
  color: white;
  padding: 3px;
  border: 1px solid black;
  width : 150px;
  height: 200px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.imgFig15060 { /* no border 150 by 60 table */
  color: white;
  padding: 3px;
  border: 1px solid black;
  width : 150px;
  height: 60px;
  display: block; /* center alignment */
  margin-left: auto;
  margin-right: auto;
}
.figText {
  text-align: center;
  font-size: 14px;
}
.textLeft {
  margin-left: 30px;
  text-align: left;
  font-size: 14px;
}
.textIndent20 {  
  margin-left: 20px;
}
.textIndent25 { /* Exercise 1) 
  margin-left: 20px;
}
.textIndent40 { /* 예제 수식 시작 */
  margin-left: 40px;
}
.textIndentL20 { /* 예제 1) */
  margin-left: 20px;
  text-indent: -20px;
}
.textIndentL25 { /* Exercise */
  margin-left: 25px;
  text-indent: -25px;
}
.textIndentL30 {
  margin-left: 30px;
  text-indent: -30px;
}
.textIndentL30M10 {
  margin-left: 30px;
  text-indent: -10px;
}
.textIndentL30M20 {
  margin-left: 30px;
  text-indent: -20px;
}
.textIndentL50M20 {
  margin-left: 50px;
  text-indent: -20px;
}
.tableCenter { /* center alignment */
  margin-left: auto;
  margin-right: auto;
  font-size: 14px;
}
.thGrey {
  padding: 4px;
  text-align: center;
  border: 1px solid black;
  background-color: lightgrey;
}
.tdLeft {
  padding-left: 8px;
  padding-right: 4px;
  text-align: left;
  border: 1px solid black;
}
.tdCenter {
  padding-left: 4px;
  padding-right: 4px;
  text-align: center;
  border: 1px solid black;
}
.tdRight {
  padding-left: 4px;
  padding-right: 4px;
  text-align: right;
  border: 1px solid black;
}

ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}
li a {
    display: block;
    color: white;
    height: 20px;
    width: 85px;
    padding: 7px 7px;
    text-decoration: none;
    background-color: #3498DB; /* blue */
    border: 1px solid green;
}
li a:hover {
    background-color: #2980B9;
    color: white;
}
.hoverBackground {
    display: block;
    color: white;
    height: 20px;
    width: 85px;
    padding: 7px 7px;
    text-decoration: none;
    background-color: #2980B9; /* blue */
    border: 1px solid green;
}