/*8";
/* CSS Document */

/* ---------- GENERAL ------- font-family: "Franklin Gothic Medium", "Franklin Gothic", "ITC Franklin Gothic", Arial, sans-serif; --- */
*{
font-family: "times","courier";
}
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}


body {
	background: #eaeaea;
	background-repeat: repeat;
	color: #999;
	font: 100%/1.5em sans-serif;
	margin: 0;
}

h3 { margin: 0; }

a {
	color: #999;
	text-decoration: none;
}

a:hover { color: #1dabb8; }
input {
	border: none;
	font-family: inherit;
	font-size: inherit;
	margin: 0;
	-webkit-appearance: none;
}

input:focus {
  outline: none;
}

input[type="submit"] { cursor: pointer; }

.clearfix { *zoom: 1; }
.clearfix:before, .clearfix:after {
	content: "";
	display: table;	
}
.clearfix:after { clear: both; }

/* ---------- menu ---------- */
#topi{
position:absolute;
top:0px;
background-color:#282830;
width:100%;
height:30px;
}
#center{
margin:0 auto;
display:block;
width:85%;
}
#centerk{
margin:0 auto;
display:block;
width:60%;
}
.menuku{
	position:relative;
	top:0;
	background-color: #282830;
	color: #fff;
	display:block;
	height:50px;
	text-align: left;
	width:100%;
	margin:0 auto;
}
.menuku img{
height:30px;
padding:10px;
position:relative;
top:0;
float:left;
}
#menu {
	margin: 0 auto;
	width: 100%;
	display:block;
}

#menu h3 {
	background-color: #282830;
	border-radius: 5px 5px 0 0;
	color: #fff;
	font-size: 14px;
	padding: 20px;
	text-align: center;
	text-transform: uppercase;
}

#menu fieldset {
background-color:rgba(255, 255, 255, 0.18);
	/*background: #fff;*/
	border-radius: 0 0 5px 5px;
	padding: 10px;
	position: relative;
}

#menu fieldset:before {
	background-color: #fff;
	content: "";
	height: 12px;
	left: 20px;
	margin: 4px 0 0 -4px;
	position: absolute;
	top: 0;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
	width: 12px;
}

#menu input {
	font-size: 14px;
}

#menu input[type="text"],
#menu input[type="number"],
#menu input[type="email"],
#menu input[type="password"] {
	border: 1px solid #dcdcdc;
	padding: 5px 10px;
	width: 250px;
	margin-top:10px;
	height:30px;
}
#menu input[type="email"] {
	height:15px;
	border-radius: 3px 3px 0 0;
}

#menu input[type="password"] {
	border-top: none;
	border-radius: 0px 0px 3px 3px;
}

#menu input[type="submit"] {
	background: #1dabb8;
	color: #FFFFFF ;
	float: left;
	font-weight: bold;
	margin-top: 10px;
	padding: 10px 10px;
}

#menu input[type="submit"]:hover { background: #198d98; }

#menu footer {
	font-size: 12px;
	margin-top: 16px;
}
#menu div{
height:35px;
display:block;
width:42%;
background-color:#04afff;
float:left;
padding:10px;
margin:10px;
}
#fully{
width:100%;
h:100%;
}
#menu img{
padding:30px 0px 30px 10px;
width:50px;
float:left;
display:block;
}
#menu h1 {
    font: 18px 
    padding: 0px 0px 5px 40px;
    display: block;
    border-bottom: 1px solid #F5F5F5;
    color: #969696;
	
}
#menu h1>span {
    display: block;
    font-size: 11px;
    color: #C4C2C2;
}
#menu h4{
display:block;
width:250px;
float:left;
margin-left:10px;
margin-top:0px;
background-color:#ff;
color:#FFFFFF;
font:bold 18px Arial, Helvetica, sans-serif;
}
#menu h5{
display:block;
width:250px;
float:left;
margin-left:10px;
margin-top:1px;
background-color:#ff;
color:#FFFFFF;
font:bold 16px Arial, Helvetica, sans-serif;
}

#menu h4>span{
font:15px Arial, Helvetica, sans-serif;
color:#fff;
}


.info {
	background: #e5e5e5;
	border-radius: 50%;
	display: inline-block;
	height: 10px;
	line-height: 20px;
	margin: 0 10px 0 0;
	text-align: center;
	width: 20px;
}
.formku label>span{
float:left;
display:block;
width:190px;
color:#fff;
margin-top:10px;
height:30px;
text-align:right;
}


#modal
{
	visibility: hidden;
	position: fixed;
    left: 0;
    top: 0;
    width: 100%;
   height: 100%;
    text-align: center;
    z-index: 1000;
    background-color: rgba(0,0,0, .5); 
	
	
}

#modal div{	
    width: 550px;
    margin: 200px auto;
    background: #fff;    
    padding: 5px;
    text-align: left;
    overflow: hidden;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
}

#modal h1{
font:bold 14px Arial, Helvetica, sans-serif;
color:#000;
margin:20px;
}
#modal input[type="submit"] {
	background: #1dabb8;
	color: #fff;
	font-weight: bold;
	margin: 10px;
	padding: 4px 10px;
}

#modal input[type="submit"]:hover { background: #198d98; }
#wrapper{
background-color:#fff;
min-height:50px;
padding-bottom:20px;
}
table{
width:100%;

text-align:center;
padding:5px;
}
th{
border-bottom:1px solid #000;
padding:1px 1px;
text-align:center;
font-size:10px;
}
td{
border-bottom:1px solid #0033FF ;
padding:1px 1px;
font-size:12px;
vertical-align: top;
color:#000;
text-align: center;
}


tbody{
margin:5px auto;
}
.more table{
width:100%;
margin:5px;
}
#input{
width:120px;
}

.tombolku.adalah {
display:block;

    font: 12px Timesroman, Helvetica, sans-serif;
	min-width:55px;
	border: 1px solid rgba(0, 0, 0, .2);
	color: #330  ;
	display: inline-block;
	padding: 1px 1px;
	text-decoration: none;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	-box-shadow: inset 8 1 0 rgba(255, 255, 255, .3);
	-moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3);
	-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3)
}
	.tombolku.adalah.red {
		background: #c60000;
		background: linear-gradient(top, #c60000 0%, #b20000 100%);
		background: -moz-linear-gradient(top, #99CCCC 0%, #b20000 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #c60000), color-stop(100%, #b20000));
		background: -webkit-linear-gradient(top, #c60000 0%, #b20000 100%)
	}
	.tombolku.adalah.orange {
		background: #f99015;
		background: linear-gradient(top, #f99015 0%, #f76c0f 100%);
		background: -moz-linear-gradient(top, #99FF99 0%, #f76c0f 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f99015), color-stop(100%,#f76c0f));
		background: -webkit-linear-gradient(top, #f99015 0%,#f76c0f 100%)
	}
	.tombolku.adalah.green {
		background: #30a146;
		background: linear-gradient(top, #30a146 0%, #249334 100%);
		background: -moz-linear-gradient(top, #33CC99 0%, #249334 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #30a146), color-stop(100%, #249334));
		background: -webkit-linear-gradient(top, #30a146 0%, #249334 100%)
	}
	.tombolku.adalah.blue {
		background: #16a4c8;
		background: linear-gradient(top, #16a4c8 0%, #1086b6 100%);
		background: -moz-linear-gradient(top, #16a4c8 0%, #1086b6 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #16a4c8), color-stop(100%, #1086b6));
		background: -webkit-linear-gradient(top, #16a4c8 0%, #1086b6 100%)
	}
	.tombolku.adalah.gray {
		background: #c2c2c2;
		background: linear-gradient(top, #c2c2c2 0%, #aeaeae 100%);
		background: -moz-linear-gradient(top, #c2c2c2 0%, #aeaeae 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #c2c2c2), color-stop(100%, #aeaeae));
		background: -webkit-linear-gradient(top, #c2c2c2 0%, #aeaeae 100%)
	}
	.tombolku.adalah.dark {
		background: #464646;
		background: linear-gradient(top, #464646 0%, #343434 100%);
		background: -moz-linear-gradient(top, #464646 0%, #343434 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #464646), color-stop(100%, #343434));
		background: -webkit-linear-gradient(top, #464646 0%, #343434 100%)
	}
	.tombolku.adalah:hover { color: #fff; opacity: .5 }
	
	
	
	
.buttons
{
  display: inline-block;
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#eeeeee',GradientType=0 ); /* IE6-9 */
  background: linear-gradient(top, #eeeeee 0%,#eeeeee 100%); /* W3C */
  padding: 0 1em;
  margin: 0.5em;
  font: bold 0.8em Arial, Helvetica;
  text-decoration: none;
  color: #333;
  border-bottom: 1px solid #000;
}
.buttons:before
{
  float: left;
  width: 1em;
  text-align: center;
  font-size: 1.2em;
  margin: 0 0.5em 0 -1em;
  padding: 0 .2em;
  pointer-events: none;
}
.add:before    { content: "\271A"; }
.edit:before   { content: "\270E"; }
.delete:before { content: "\2718";}
.save:before   { content: "\2714";}
.email:before  { content: "\2709";}
.cross:before  { content: "\2716"; }
.like:before               { content: "\2764"; }
.star:before               { content: "\2605"; }
.spark:before              { content: "\2737"; }
.play:before               { content: "\25B6"; }
.watch:before              { content: "\231A"; }
.blacksun:before           { content: "\2600"; }
.cloud:before              { content: "\2601"; }
.umbrella:before           { content: "\2602"; }
.snowman:before            { content: "\2603"; }
.blackstar:before          { content: "\2605"; }
.whitestar:before          { content: "\2606"; }
.blackphone:before         { content: "\260E"; }
.whitephone:before         { content: "\260F"; }
.saltire:before            { content: "\2613"; }
.hot_drink:before          { content: "\2615"; }
.skull:before              { content: "\2620"; }
.radioactive:before        { content: "\2622"; }
.biohazard:before          { content: "\2623"; }
.peace:before              { content: "\262E"; }
.yingyang:before           { content: "\262F"; }
.frowning_face:before      { content: "\2639"; }
.smiling_face:before       { content: "\263A"; }
.first_quarter_moon:before { content: "\263D"; }
.last_quarter_moon:before  { content: "\263E"; }
.wheelchair:before         { content: "\267F"; }
.recycle:before            { content: "\267D"; }
.recycle2:before           { content: "\267C"; }
.music_note:before         { content: "\266C"; }
.warning:before            { content: "\26A0"; }
.male_and_female:before    { content: "\26A4"; }
.scissors:before           { content: "\2701"; }
.airplane:before           { content: "\2708"; }
.snow:before               { content: "\2042"; }

#iform{
color:#000;
display:block;
border:2px solid #000;
margin:10px auto;
width:95%;
padding-top:10px;
}
#iform a{
margin:20px 0px 20px 250px;
}
#iform input[type="text"]{
border:none;
}
#iform tr:nth-child(2)		{ background-color:#fff; margin-top:0px;}

#lamp{
background-color:#269f01;
color:#fff;
font-size:12px;
padding:3px;
border:1px solid #000;
border-radius:2px;
}

.tabel-revisi {
    width: 95%; 
}

.tabel-revisi tr:hover {
    background: #fbf8e9;
    -o-transition: all 0.1s ease-in-out;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;     
}    
.tabel-revisi input[type="text"] {
width:100%;
}
#menu2k {
	margin: 0 auto;
	width: 100%;
	display:block;
	background-color:#fff;
	padding-bottom:10px;
	
}

#menu2 {
	margin: 0 auto;
	width: 100%;
	display:block;
	background-color:#fff;
	padding-bottom:200px;
	
}

#menujam {
	margin: 0 auto;
	width: 70%;
	display:block;
	background-color:#CCFFFF;
	padding-bottom:200px;
	
}

#menujam fieldset {
	background: #fff;
	border-radius: 0 0 5px 5px;
	padding: 20px;
	position: relative;
}

#menu2 fieldset {
	background: #CCFFFF;
	border-radius: 0 0 5px 5px;
	padding: 20px;
	position: relative;
}

#menu2 fieldset:before {
	background-color: #fff;
	content: "";
	height: 12px;
	left: 20px;
	margin: -4px 0 0 -4px;
	position: absolute;
	top: 0;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
	width: 12px;
}
#menu2 h1 {
    font: 18px "Trebuchet MS", Arial, Helvetica, sans-serif;
    padding: 0px 0px 10px 20px;
    display: block;
    border-bottom: 1px solid #F5F5F5;
    color: #969696;
	
}
#menu2 h1>span {
    display: block;
    font-size: 11px;
    color: #C4C2C2;
}

/* ###### White / Pink #########*/
.ipop {
    margin-left:auto;
    margin-right:auto;

    max-width: 500px;
    background: #FFF;
    padding: 30px 30px 20px 30px;
    box-shadow: rgba(187, 187, 187, 1) 0 0px 20px -1px;
    -webkit-box-shadow: rgba(187, 187, 187, 1) 0 0px 20px -1px;
    font: 12px Arial, Helvetica, sans-serif;
    color: #666;
    border-radius: 10px;
    -webkit-border-radius: 10px;
}
.ipop h1 {
    font: 24px "Trebuchet MS", Arial, Helvetica, sans-serif;
    padding: 0px 0px 10px 40px;
    display: block;
    border-bottom: 1px solid #F5F5F5;
    margin: -10px -30px 10px -30px;
    color: #969696;
}
.ipop h1>span {
    display: block;
    font-size: 11px;
    color: #C4C2C2;
}
.ipop label {
    display: block;
    margin: 0px 0px 5px;
}
.ipop label>span {
    float: left;
    width: 20%;
    text-align: right;
    padding-right: 10px;
    margin-top: 10px;
    color: #969696;
}
.ipop input[type="text"], .ipop input[type="email"], .ipop textarea,.ipop select{
    color: #555;
    width: 70%;
    padding: 3px 0px 3px 5px;
    margin-top: 2px;
    margin-right: 6px;
    margin-bottom: 5px;
    border: 1px solid #e5e5e5;
    background: #fbfbfb;
    height: 15px;
    line-height:5px;
    outline: 0;
    -webkit-box-shadow: inset 1px 1px 2px rgba(200,200,200,0.2);
    box-shadow: inset 1px 1px 2px rgba(200,200,200,0.2);
}
.ipop textarea{
    height:40px;
    padding: 5px 0px 0px 5px;
    width: 70%;
}
.ipop .button {
    -moz-box-shadow:inset 0px 1px 0px 0px #fbafe3;
    -webkit-box-shadow:inset 0px 1px 0px 0px #fbafe3;
    box-shadow:inset 0px 1px 0px 0px #fbafe3;
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ff5bb0), color-stop(1, #ef027d) );
    background:-moz-linear-gradient( center top, #000 5%, #ef027d 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#000', endColorstr='#ef027d');
    background-color:#000;
    border-radius:9px;
    -webkit-border-radius:9px;
    -moz-border-border-radius:9px;
    border:1px solid #ee1eb5;
    display:inline-block;
    color:#ffffff;
    font-family:Arial;
    font-size:15px;
    font-weight:bold;
    font-style:normal;
    height: 40px;
    line-height: 30px;
    width:100px;
    text-decoration:none;
    text-align:center;
    text-shadow:1px 1px 0px #c70067;
}
.ipop .button:hover {
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ef027d), color-stop(1, #ff5bb0) );
    background:-moz-linear-gradient( center top, #ef027d 5%, #ff5bb0 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ef027d', endColorstr='#ff5bb0');
    background-color:#ef027d;
}
.ipop .button:active {
    position:relative;
    top:1px;
}
.ipop select {
    background: url('down-arrow.png') no-repeat right, -moz-linear-gradient(top, #FBFBFB 0%, #E9E9E9 100%);
    background: url('down-arrow.png') no-repeat right, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FBFBFB), color-stop(100%,#E9E9E9));
   appearance:none;
    -webkit-appearance:none;
   -moz-appearance: none;
    text-indent: 0.01px;
    text-overflow: '';
    width: 70%;
    line-height: 15px;
    height: 30px;
}
.boxview {
padding:25px;
margin-top:30px;
margin-bottom:100px;
min-height:600px;
width:100%;
}

#myalert{
display:none;
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
text-align: center;
z-index: 1000;
background-color: rgba(0,0,0, .5); 
}

#myalert div{   
width: 300px;
min-height:200px;
margin: 200px auto;
background-color: #fff;    
padding: 0px;
text-align: left;
overflow: hidden;
vertical-align:center;
padding:10px;
border-top:3px solid #00e265;
}

#myalert h1{
font-size:22px;
color:green;
font-weight:bold;
}
#myalert h1>span{
display:block;
margin-top:-5px;
font-size:9px;
color:green;
font-weight:bold;
text-align:left;
}    
#myalert p{
margin-top:40px;
font-size:15px;
color:green;
font-weight:bold;
text-align:center;
}
#myalert a{
float:right;
marging:5px;
}   




#formalert{
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
text-align: center;
z-index: 1000;
background-color: rgba(0,0,0, .5); 
}

#formalert div{   
width: 400px;
min-height:300px;
margin: 50px auto;
background-color: #fff;    
padding:0px;
text-align: left;
overflow: hidden;
vertical-align:bottom;
padding:10px;
border-top:3px solid #ff9600;
}

#formalert h1{
font-size:18px;
color:green;
font-weight:bold;
}
#formalert h1>span{
display:block;
margin-top:-10px;
font-size:9px;
color:green;
font-weight:bold;
text-align:left;
}    
#formalert p{
margin-top:40px;
font-size:15px;
color:green;
font-weight:bold;
text-align:center;
}
#formalert a{
float:right;
marging:5px;
}   
#formalert label{
display:block;
font-size:12px;
font-weight:bold;
text-align:center;
}
#formalert input[type="text"]{
border:1px solid #ff9600;
width:85%;
margin:0px 20px;
}
#formalert input[type="number"]{
border:1px solid #ff9600;
width:85%;
margin:0px 20px;
}
#formalert input[type=number]::-webkit-inner-spin-button, 
#formalert input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}
#formalert input[type="submit"]{
display:inline-block;
text-align:center;
background-color:#e74c3c;
height:20px;
padding:5px;
font-size:12px;
font-weight:bold;
color:#fff;
margin:20px;
float:right;
}
#formalert table{
width:60%;}
}
#formalert tr{
border:none;
padding:0px;
margin:0;
}
#formalert td{
border:none;
padding:0px 0px 0px 4px;
margin:0;
text-align:left;
}
#formalert th{
display:inline-block;
border:none;
padding:0px;
margin:0;
}

#formalert pre{
width:280px;
height:200px;
background-color:#e1e1e1;
padding:10px;
overflow: auto;
font-family:arial;
font-size:14px;
font-weight:bold;
text-transform: uppercase;
}
#formalert select{
border:1px solid #fca43b;
}





.opsi {
   width: 350px;
   height: 35px;
   overflow: hidden;
background-image: url('img/dow.png');
   background-repeat: no-repeat;
   background-position: right center;
   padding-right: 20px;   
   border: 2px solid #666;
   font-size:17px;
   color:#666;
   
   }

   

.opsi option{
padding:5px;
font-size:17px;orm
}   
   
#tombol{
   height: 35px;
   background-color:#ff7302;
   padding:6px;
   color:#fff;
   font-size:15px;
   font-weight:bold;
   vertical-align:top;
   width:80px;
 }
   
.supercenter{
display:block;
margin:0 auto;
text-align:center;
}
.supercenter > table{
margin:5 auto;
width:95%;
}
.boxx{
margin:2px;
width:300px;
height:70px;
background-color:#666;
color:#fff;
font-size:15px;
font-weight:bold;
float:left;
padding:10px;
}
#phpalert{
display:none;
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
text-align: center;
z-index: 1000;
background-color: rgba(0,0,0, .5); 
}

#phpalert div{   
width: 300px;
min-height:200px;
margin: 200px auto;
background-color: #fff;    
padding: 0px;
text-align: left;
overflow: hidden;
vertical-align:center;
padding:10px;
border-top:3px solid #00e265;
}

#phpalert h1{
font-size:22px;
color:green;
font-weight:bold;
}
#phpalert h1>span{
display:block;
margin-top:-10px;
font-size:9px;
color:green;
font-weight:bold;
text-align:left;
}    
#phpalert p{
margin-top:40px;
font-size:15px;
color:green;
font-weight:bold;
text-align:center;
}
#phpalert a{
float:right;
marging:5px;
}   
#foot{
position:fixed;
bottom:0px;
border:2px solid #666;
width:70%;
margin:0 auto;
background-color:#828282;
}
.huge{
margin:150px;
padding:50px;
background-color:#bfbfbf;
}
.huge input[type="text"]{
border:none;
height:60px;
width:250px;
font-size:40px;
margin:5px;
}
.huge input[type="date"]{
border:none;
height:60px;
width:166px;
font-size:40px;
margin:5px;
}
.huge select{
border:none;
height:60px;
width:270px;
font-size:40px;
margin:5px;
}
.huge input[type="submit"]{
border:none;
height:50px;
width:530px;
font-size:40px;
margin:5px;
background-color:#259f00;
color:#fff;
}