@font-face {
  font-family: 'thaisans_neue_blackregular';
  src: url('../fonts/thaisansneue-black-webfont.eot');src: url('../fonts/thaisansneue-black-webfont.eot?#iefix') format('embedded-opentype'),url('../fonts/thaisansneue-black-webfont.woff') format('woff'),url('../fonts/thaisansneue-black-webfont.ttf') format('truetype'),url('../fonts/thaisansneue-black-webfont.svg#thaisans_neue_blackregular') format('svg');font-weight: normal;font-style: normal;
}

@font-face {
  font-family: 'thaisans_neuebold';
  src: url('../fonts/thaisansneue-bold-webfont.eot');src: url('../fonts/thaisansneue-bold-webfont.eot?#iefix') format('embedded-opentype'),url('../fonts/thaisansneue-bold-webfont.woff') format('woff'),url('../fonts/thaisansneue-bold-webfont.ttf') format('truetype'),url('../fonts/thaisansneue-bold-webfont.svg#thaisans_neuebold') format('svg');font-weight: normal;font-style: normal;
}

@font-face {
  font-family: 'thaisans_neue_extbdregular';
  src: url('../fonts/thaisansneue-extrabold-webfont.eot');src: url('../fonts/thaisansneue-extrabold-webfont.eot?#iefix') format('embedded-opentype'),url('../fonts/thaisansneue-extrabold-webfont.woff') format('woff'),url('../fonts/thaisansneue-extrabold-webfont.ttf') format('truetype'),url('../fonts/thaisansneue-extrabold-webfont.svg#thaisans_neue_extbdregular') format('svg');font-weight: normal;font-style: normal;
}

@font-face {
  font-family: 'thaisans_neue_extltregular';
  src: url('../fonts/thaisansneue-extralight-webfont.eot');src: url('../fonts/thaisansneue-extralight-webfont.eot?#iefix') format('embedded-opentype'),url('../fonts/thaisansneue-extralight-webfont.woff') format('woff'),url('../fonts/thaisansneue-extralight-webfont.ttf') format('truetype'),url('../fonts/thaisansneue-extralight-webfont.svg#thaisans_neue_extltregular') format('svg');font-weight: normal;font-style: normal;
}

@font-face {
  font-family: 'thaisans_neue_lightregular';
  src: url('../fonts/thaisansneue-light-webfont.eot');src: url('../fonts/thaisansneue-light-webfont.eot?#iefix') format('embedded-opentype'),url('../fonts/thaisansneue-light-webfont.woff') format('woff'),url('../fonts/thaisansneue-light-webfont.ttf') format('truetype'),url('../fonts/thaisansneue-light-webfont.svg#thaisans_neue_lightregular') format('svg');font-weight: normal;font-style: normal;
}

@font-face {
  font-family: 'thaisans_neueregular';
src: url('../fonts/thaisansneue-regular-webfont.eot');src: url('../fonts/thaisansneue-regular-webfont.eot?#iefix') format('embedded-opentype'),url('../fonts/thaisansneue-regular-webfont.woff') format('woff'),url('../fonts/thaisansneue-regular-webfont.ttf') format('truetype'),url('../fonts/thaisansneue-regular-webfont.svg#thaisans_neueregular') format('svg');font-weight: normal;font-style: normal;
}

@font-face {
  font-family: 'thaisans_neue_sembdregular';
  src: url('../fonts/thaisansneue-semibold-webfont.eot');src: url('../fonts/thaisansneue-semibold-webfont.eot?#iefix') format('embedded-opentype'),url('../fonts/thaisansneue-semibold-webfont.woff') format('woff'),url('../fonts/thaisansneue-semibold-webfont.ttf') format('truetype'),url('../fonts/thaisansneue-semibold-webfont.svg#thaisans_neue_sembdregular') format('svg');font-weight: normal;font-style: normal;
}

@font-face {
  font-family: 'thaisans_neue_ultbdregular';
  src: url('../fonts/thaisansneue-ultrabold-webfont.eot');src: url('../fonts/thaisansneue-ultrabold-webfont.eot?#iefix') format('embedded-opentype'),url('../fonts/thaisansneue-ultrabold-webfont.woff') format('woff'),url('../fonts/thaisansneue-ultrabold-webfont.ttf') format('truetype'),url('../fonts/thaisansneue-ultrabold-webfont.svg#thaisans_neue_ultbdregular') format('svg');font-weight: normal;font-style: normal;
}

@font-face {
  font-family: 'thaisans_neue_ultltregular';
  src: url('../fonts/thaisansneue-ultralight-webfont.eot');src: url('../fonts/thaisansneue-ultralight-webfont.eot?#iefix') format('embedded-opentype'),url('../fonts/thaisansneue-ultralight-webfont.woff') format('woff'),url('../fonts/thaisansneue-ultralight-webfont.ttf') format('truetype'),url('../fonts/thaisansneue-ultralight-webfont.svg#thaisans_neue_ultltregular') format('svg');font-weight: normal;font-style: normal;
}

h1, .h1, h2, .h2, h3, .h3 {
  margin-bottom: 10px;
  margin-top: 10px;
  font-family: "thaisans_neuebold", Arial;
}
.compfont {
  font-family: "thaisans_neuebold", Arial;
  font-size:24px;
}
.detailfont {
  /* font-family: "thaisans_neuebold", Arial; */
  font-size:16px;
}
.mybgcolor { background-color : rgb(1, 179, 110) ;}

.menubutton {
  width : 280px;
  font-size : 20px;
  margin : 5px;
  font-family : 'thaisans_neuebold'
}

#sidemenu {
  float:left;
  width:30%;
  max-width:150px;
  height:92vh;
  background-color:#eeeeee;
}
/* The navigation menu links */
#sidemenu a {
  padding: 10px 5px 5px 10px;
  text-decoration: none;
  font-size: 1em;
  color: #818181;
  display: block;
  transition: 0.3s
}

.sidemenubutton{
  width : 148px;
  font-size : 16px;
  margin : 1px;
  font-family : 'thaisans_neuebold'
}
.sidemenubutton-incomplete{
  background-color:#fff;
  color:#009;
}
.sidemenubutton-complete{
  background-color:#0b0;
  color:#fff;
}
.sidemenubutton-active{
  background-color:#008CFF;
  color:#fff;
}


.loader {
  border: 8px solid #f3f3f3; /* Light grey */
  border-top: 8px solid #008CFF; /* Blue */
  border-radius: 50%;
  width: 60px;
  height: 60px;
  animation: spin .8s linear infinite;
  margin: 0 auto;
  text-align: center;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  50% { transform: rotate(180deg); }
  70% { transform: rotate(320deg); }
  100% { transform: rotate(360deg); }
}

.fixedrowdiv {
  /* max-width: 40em; */
  /* max-height: 20em; */
  overflow: scroll;
  position: relative;
}

.fixedrowdivtable {
  position: relative;
  border-collapse: collapse;
}

.fixedrow {
  position: -webkit-sticky; /* for Safari */
  position: sticky;
  z-index: 2;
  top: 0;
  /* background: #000; */
  /* color: #FFF; */
}

.fixedcol {
  left: 0;
  z-index: 1;
  position: -webkit-sticky; /* for Safari */
  position: sticky;
}

.fixedrowcol {
  z-index: 3;
}

input[type=text] {
  padding-left:4px;
  padding-right:4px;
}

.selectedrow {
  background : #ccebff;
}

.pointer {
  cursor:pointer;
}

.top-link-block {
  border: 2px solid #e8e8e8;
  background: #e8e8e8;
  height:auto;
  border-radius:52px;
  opacity: .6;
  transition: opacity .5s ease-out;
  -moz-transition: opacity .5s ease-out;
  -webkit-transition: opacity .5s ease-out;
  -o-transition: opacity .5s ease-out;
}
.top-link-block:hover {
  opacity: 1;
}
.top-link-block span {
  width: 52px;
  height: 52px;
  line-height: 52px;
  text-decoration: none;
  text-align: center;
  vertical-align: baseline;
  
}

.top-link-block span i {
  color: #b0b0b0;
  line-height: 52px;
  font-style: normal;
  font-weight: 400;
}

.top-link-block.affix-top {
  position: absolute; /* allows it to "slide" up into view */
  bottom: -82px; /* negative of the offset - height of link element */
  right: 10px; /* padding from the left side of the window */
}
.top-link-block.affix {
  position: fixed; /* keeps it on the bottom once in view */
  bottom: 18px; /* height of link element */
  right: 10px; /* padding from the left side of the window */
}