mycss.css

body {
    animation: bgcolor 6s infinite; 
    font-family: 'Kanit', sans-serif;
}
  
  @keyframes bgcolor {
      0% {
          background-color: #45a3e5
      }
  
      25% {
          background-color: #66bf39
      }
  
      50% {
          background-color: #eb670f
      }
  
      75% {
          background-color: #f35
      }
  
      90% {
          background-color: #864cbf
      }

      100% {
        background-color: #45a3e5
      }
  }

.w3-blue{
    color: #fff!important;
    background-color: #2196F3!important;
}
.w3-blue:hover{
    color: #fff!important;
    background-color: rgb(0, 122, 221)!important;
}

.w3-button {
    font-family : 'Kanit', sans-serif;
    border: none;
    display: inline-block;
    padding: 6px 12px;
    vertical-align: middle;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    background-color: inherit;
    text-align: center;
    cursor: pointer;
    white-space: nowrap;
    border-radius : 8px;
    font-size: 14px;
    outline: none;
    margin-right: 10px;
}

input[type = text]{
    font-family: 'Kanit', sans-serif;
    color : #222;
    padding : 10px;
    border : 4px solid #CCC;
    border-radius : 6px;
    font-size : 16px;
    text-overflow : ellipsis;
}
input[type = text]:focus{
    font-family: 'Kanit', sans-serif;
    color : #222;
    padding : 10px;
    border : 4px solid #AAA;
    border-radius : 4px;
    font-size : 16px;
    outline : none;
    text-overflow : ellipsis;
}

.chlan{
    font-family: 'Kanit', sans-serif;
    font-size: 14px;
    border: none;
    border-radius: 8px;
    padding: 6px 12px;
    cursor: pointer;
    outline: none;
    margin-right: 10px;
    background-color: #FFF;
}

.chlan:hover{
    font-family: 'Kanit', sans-serif;
    font-size: 14px;
    border: none;
    border-radius: 8px;
    padding: 6px 12px;
    cursor: pointer;
    outline: none;
    margin-right: 10px;
    background-color: #DDD;
}

.outer{
    margin-top: 200px;
    margin-bottom: auto;
    margin-left: auto;
    margin-right: auto;
    width: 772px;
    text-align: center;
}

.head{
    text-align: center;
    color: #FFF;
}

.output{
    color: #FFF;
}