body {
	font-family: Arial, Helvetica, sans-serif;
}

td {
	font-family: Arial, Helvetica, sans-serif;
}

th {
	font-family: Arial, Helvetica, sans-serif;
}
body {
  background-color: #af2cef;
  animation: bg-color 15s infinite;
  -webkit-animation: bg-color 15s infinite;
}


@-webkit-keyframes bg-color {
  0% { background-color: #af2cef; }
  20% { background-color: #f1c40f; }
  40% { background-color: #1abc9c; }
  60% { background-color: #3498db; }
  80% { background-color: #9b59b6; }
  100% { background-color: #af2cef; }
}

@keyframes bg-color {
  0% { background-color: #af2cef; }
  20% { background-color: #f1c40f; }
  40% { background-color: #1abc9c; }
  60% { background-color: #3498db; }
  80% { background-color: #9b59b6; }
  100% { background-color: #af2cef; }
}

    #thover{
      position:fixed;
      background:#000;
      width:100%;
      height:100%;
      opacity: .6
    }
     
    #tpopup{
      position:absolute;
      width:600px;
      height:180px;
      background:#fff;
      left:50%;
      top:50%;
      border-radius:5px;
      padding:60px 0;
      margin-left:-320px; /* width/2 + padding-left */
      margin-top:-150px; /* height/2 + padding-top */
      text-align:center;
      box-shadow:0 0 10px 0 #000;
    }
    #tclose{
      position:absolute;
      background:black;
      color:white;
      right:-15px;
      top:-15px;
      border-radius:50%;
      width:30px;
      height:30px;
      line-height:30px;
      text-align:center;
      font-size:8px;
      font-weight:bold;
      font-family:'Arial Black', Arial, sans-serif;
      cursor:pointer;
      box-shadow:0 0 10px 0 #000;
    }