body {
    font-family: sans-serif; 
    font-size: 12px; 
    color: #5C5C5C;
    margin: 0px; 
    background: #eee ;
}
input { 
    padding: 10px 5px;
    border: 1px solid #888;
	font-size: 14px;
	width: 160px;
}

:focus {outline: none;}
:required {background-color: #fff; outline: none; border: 1px #ff3333 solid;}
:required:invalid {   
    border: 1px #ff3333 solid;
    outline: none;
	box-shadow: none;
}
:required:valid {
    background-color: #fff;    
    border: 1px #28921f solid;
	outline: none;
}
.circle {
    border-radius: 50%;
    display: inline-block;
    text-align: center;
    width: 100%;    
}
.circle img {
    margin-top: 45px;
    border-radius: 50%;
    display: block;
    width: 100px;
    height: 100px;
    background-position:50% 50%;
    background-repeat:no-repeat; 
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
    padding:1px;
    border:1px solid #fff;
    background-color:#ff0;
}

#wrapper {
    margin-top:10px;
    width:490px;
    margin-right: auto;
    background: #fff url("../images/bg.jpg") no-repeat;	
    /*background: #fff url("../images/merdeka2.jpg") no-repeat;*/	
    margin-left: auto;
    height:250px;
    border: 1px #fff solid;
    font-size:10px;
    position: relative;
}

#wrapper:before, #wrapper:after
{
    z-index: -1;
  position: absolute;
  content: "";
  bottom: 25px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  -webkit-box-shadow: 0 35px 20px #777;
  -moz-box-shadow: 0 35px 20px #777;
  box-shadow: 0 35px 20px #777;
  -webkit-transform: rotate(-8deg);
  -moz-transform: rotate(-8deg);
  -o-transform: rotate(-8deg);
  -ms-transform: rotate(-8deg);
  transform: rotate(-8deg);
}
#wrapper:after
{
    -webkit-transform: rotate(8deg);
  -moz-transform: rotate(8deg);
  -o-transform: rotate(8deg);
  -ms-transform: rotate(8deg);
  transform: rotate(8deg);
  right: 10px;
  left: auto;
}

#content .form-login { 
    font-size: 10pt;
    border-collapse: collapse;
    text-align: center;
    margin: 10px 15px 0px 0px;
    width: 230px;
    box-shadow: 1px 1px 5px #888;
    background-color: rgba(255, 255, 255, 0.6);
    color: #333333;
	padding: 5px;
	float: right;
	min-height: 220px;
	border-radius: 5px;
}
#content .form-login p {
	padding: 0px;
	margin: 3px;
}
#kode_cabang {
    background: #ffffff url(../images/local1.png) no-repeat 2% center;
	padding-left: 35px;
}
#username {
    background: #ffffff url(../images/project.png) no-repeat 2% center;
	padding-left: 35px;
}
#password {
    background: #ffffff url(../images/calculator.png) no-repeat 2% center;
	padding-left: 35px;
}

.t{
    color:#F00;
    font-weight:bold;	
}
.error { font: normal 11px sans-serif; color: #ff6666;}

.submit {
    cursor: pointer;
    padding: 3px 10px 3px 10px;
    background-color: #8ad403;
    box-shadow: 1px 1px 5px #888;
    border: 1px solid #fff;
    font-size: 14px;
    color: #fff;
	width: 80px;
	margin-top: 10px;
}

.submit:hover {
    color: #333333;  
    box-shadow: 0px 0px 0px #888;
    background-color: #fff;
    border: 1px #8ad403 solid;
}

#footer {
    margin-top: 60px;
    text-align: center;
    font-size: 12px;
}