.resize-sm {
    font-size: .8em;
    text-decoration: none;
  }
  .resize-md {
    font-size: 1em;
    text-decoration: none;
  }
  .resize-lg {
    font-size: 1.5em;
    text-decoration: none;
  }
  .animate {
    -webkit-transition: font-size 0.5s;
    -moz-transition: font-size 0.5s;
    -o-transition: font-size 0.5s;
    -ms-transition: font-size 0.5s;
    transition: font-size 0.5s;
  }
  .resizer-content {
  text-decoration: none;
  }
  .resizer {
    cursor: pointer;
    margin-left: 0
  }
  .active {
    text-decoration: none;
  }
  #bel {
      height: 35px;
      border-radius:0;
  
  }
  #ket1 {
      font-size: 9px;
      width: 35px;
      height:33px;
      border-radius:0;
      z-index: 0;
      background-color: #d3d3d3;
      border:0;
      color: black;
  }
  #ket2 {
      font-size: 13px;
      width: 35px;
      height:33px;
      border-radius:0;
      z-index: 0;
      background-color: #d3d3d3;
      border:0;
      color: black;
  }
  #ket3 {
      border-radius:0;
      z-index: 0;
      height:33px;
      background-color: #d3d3d3;
      border:0;
      color: black;
      font-size: 16px;
      width: 40px;
  
  }
  #btn {
      border-radius:0;
      z-index: 0;
      background-color: #a8a8a8;
      border:0;
      font-size: 17px;
      
  }
  #btni {
      border-radius:0;
      z-index: 0;
      background-color: rgb(219, 32, 32);;
      border:0;
      font-size: 17px;
       cursor:default; 
       pointer-events:none;
  }
  #divwaktu {
      border-radius:0;
      z-index: 0;
      border:0;
      background-color: #2e6499;
      color: white;
      font-size: 17px;
  }
  #nomer {
      border-radius:0;
      z-index: 0;
      border:0;
      background-color: #2e6499;
      color: white;
      font-size: 22;
      width: 55px;
  }
  #ket {
      border-radius:0;
      z-index: 0;
      background-color: #d3d3d3;
      border:0;
      color: black;
      
  }
  #keto {
      border-radius:0;
      z-index: 0;
      background-color: #ffffff;
      border:0;
      color: black;
      
      
  }
  #oket {
      border-radius:0;
      z-index: 0;
      background-color: #d3d3d3;
      border:0;
      color: black;
      
  }
  #prev {
      border-radius:0;
      z-index: 0;
      background-color: #6d6d6d;
      border:0;
      
  }
  #yakin {
      border-radius:0;
      background-color: #69c44a;
      border:0;
  }
  #next {
      border-radius:0;
      z-index: 0;
      background-color: #2e6499;
      border:0;
      
  }
  body{
   
    margin:0;
    padding:0;
  }
  
  .sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 0;
    right: 0;
    background-color: #ffffff;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 30px;
    
  }
  
  .sidenav a {
      
      text-decoration: none;
      font-size: 15px;
      color: #818181!important;
      display: block;
      transition: 0.3s;
  }
  
  .slideBtn {
    transition: .5s;
    position: fixed;
    right: 0;  
    font-size:13px;
    cursor:pointer;
    margin-right:0px;
    margin-top:110px;
    border-radius: 0px;
    font-family: sans-serif;
    z-index:-2;
  }
  
  #main {
    transition: .5s;  
    background-color:white;
  }
  
  section{
    padding:20px;
  }
  section+section{
    padding-top:0;
  }
  
  article{  
    border-top:1px solid green;
    background-color:gray;
  }
  .col-sm-4 {
      font-color: #000000;
      background-color: #ffffff;
      color: black;
     
      padding: 5px;
  } 
  div.col-sm-4 {
      text-align: center;
  }
  .kotak {
      font-color: #000000;
      background-color: #ffffff;
      color: black;
      border-width:2px;
      border-style:solid;
      border-color: #000000;
      width: 100%;
  } 
  #garistom {
    border:0;
    margin-bottom:10px;
  }