/* general template */
header {
/*	background-color:  #0a0a0a; */
	background: linear-gradient(to bottom, #0a0a0a, #6c6248, #0a0a0a);
	border-style: none;
	position: fixed;  /* absolute: is positioned relative to the nearest positione; sticky ikut gerakan mouse ; fixed; is positioned relative to the viewport, which means it always stays in the same place even if the page is scrolled*/
	top: 0px;
	left: 1px;
	right: 1px;
	width: 100%;
	height: 30px;
	text-align: center;
	vertical-align: center;
	justify-content: center;
}

@keyframes gradientShift {
  0% { background-position: 0% 50%; }
  100% { background-position: 100% 50%; }
}

.animated-gradient {
  background: linear-gradient(270deg, #ff6f61, #ffcc00, #00bfff);
  background-size: 600% 600%;
animation: gradientShift 2s ease infinite; }

body {
/*  background: linear-gradient(to left, #6c6248, #e0dcd6, #e8ddcc);  
  background: linear-gradient(270deg, #6c6248, #e0dcd6, #6c6248); 
  background-size: 600% 600%;
  animation: gradientShift 10s ease infinite; */
  background: linear-gradient(270deg, #6c6248, #e0dcd6);
  border-style: none;
  position: relative;
  top: 25px;
}
footer {
/*	background-color: green; */
	border-style: none;
	position: absolute;
	width: 100%;
	text-align: right;
}

h1 {
  color: white;
  text-align: center;
}

p {
  font-family: verdana;
  font-size: 20px;
}

/* custom template */
.tabinduk {
	width: 100%
	text-align: center;
	border: 1px solid black;
	padding: 10px;
}
.tabel-login{
	margin-left: auto;
	margin-right: auto;
}
.tabel-btborder td{
	border-bottom: 1px solid black;
}
.tabel-list td{
	border: 1px solid #e3dcdc;
}
.menu-atas{
	position:relative;
	display: box;
	top: 5px;
	border: 2px red;
	border-radius: 2px;
	background: #CECECE;
	text-decoration: none;
}.menu-atas:hover {
	background-color: yellow;
}
.menu-on{
	position:relative;
	display: box;
	top: 5px;
	border: 2px red;
	border-radius: 2px;
	background: yellow;
	text-decoration: none;
	font-weight: bold;
}
.tabel-main{
	margin: 0 auto;
	background: white;
	width: 99%;
	padding: 1px;
	border: none;
}
.tabel-main:th {
	border: 1px solid yellow;
}

/* pertombolan */
.key-baru{
	display: box;
	background: #CECECE;
	border: 1px solid green;
	text-decoration: none;
	padding: 2px;
	border-radius: 2px;
}
.key-baru:hover {
	background-color: yellow;
}
.key-on{
	display: box;
	background: yellow;
	border: 1px solid green;
	text-decoration: none;
	font-weight: bold;
	padding: 2px;
	border-radius: 2px;
}
.key-warn{
	display: box;
	background: orange;
	border: 1px solid green;
	text-decoration: none;
	font-weight: bold;
	padding: 2px;
	border-radius: 2px;
}
.key-warn:hover{
	background-color: yellow;
	font-weight: bold;
}
.key-save{
	display: box;
	background: #98F5F9;
	border: 1px solid green;
	text-decoration: none;
	font-weight: bold;
	padding: 2px;
	border-radius: 2px;
}
.key-save:hover{
	background-color: yellow;
	font-weight: bold;
}