@charset "utf-8";
/* CSS Document */
#myweb{
	position:absolute;
	top:0;
	left: 0;
	width: 100%;
	height:100%;
	background-color:#000000;
}
.menu-utama-back{
	width: 100%;
	height:auto;
	margin:0 auto;
	z-index:999999;	
	position: relative;
}
.menu-utama{
	width: 100%; 
    height: 100%;
	position: relative;
	background:url(../images/menu-utama-back.jpg) no-repeat top center;
	background-size:contain;
	float:left;
}
.header-wrap{
	width: 100%;
	height:auto;
	margin:0 auto;
	z-index:999999;	
	position: relative;
}
.header{
	width:100%;
	height:167px;
	position: relative;
	float:left;
	background:url(../images/header2.jpg) no-repeat top center;
	background-size:contain;
	z-index:999999;
}
.menu-home{
	width:100%;
	padding-top:147px;
	height:20px;
	position: relative;
	float:left;
}
.containers{
	width: 100%;
	height:auto;
	position: relative;
	margin:0 auto;
	overflow:auto;
	background-color:#fff;
}

.content{
	width: 100%;
	height:auto;
	position: relative;
	overflow:auto;
	float:left;
}

.footer-wrap{
	position: relative;
	width: 100%;
	height:auto;
	margin:0 auto;
	z-index:999999;
}
.footer{
	width:100%;
	height:100px;
	position: relative;
	float:left;
	background-color:#000000;
	z-index:999999;
	border-top:1px solid #fff;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#FFFFFF;
}
/*--------------------------------------------------------------------------------------------------------------------*/

.bread{
	width:100%;
	height:20px;
	float:left;
	border-bottom:1px dotted #CCC;
	margin-bottom:10px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#090;
	text-decoration:none;	
}
.entry-report{
	width:150px;
	height:150px;
	float:left;	
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	font-weight:bold;
	color:#000;
	text-decoration:none;	
}
.style-ul a{
	color:#000;
	margin-left:3px;
	padding-left:1px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	text-decoration:none;
}
.style-ul a:hover{
	color:#06F;
	margin-left:3px;
	padding-left:1px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	text-decoration:none;
}
.table-title{
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	font-weight:bold;
	color:#000;
}
.table-text{
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#000;
}
.table-text2{
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#000;
}
.menuicon{
	width:100%;
	float:left;
	display:none;
}
.welcome{
	width:100%;
	float:left;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	font-weight:bold;
	color:#000;
}
.iconmenu{
	width:50%;
	float:left;
	height:150px;
	
}
.menu-left{
	width:20%;
	float:left;
}
.isi-menu{
	width:80%;
	overflow:auto;
}
 /* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
	background:url(../images/back-login.jpg);
	background-size:cover;
    background-color: #fefefe;
    margin: 25% auto; /* 25% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    width: 20%; /* Could be more or less, depending on screen size */
	font-family:"AvantGarde Bk BT";
	font-size:12px;
	font-weight:bold;
	-moz-border-radius-topleft:5px;
	-moz-border-radius-topright:5px;
	border-top-left-radius:5px;
	border-top-right-radius:5px;
	box-shadow: 0px -1px 2px 0 #065881 inset,
              0px 1px 1px 1px #ccc,
              0 0 0 1px #fff,
              0 2px 9px 5px #ddd;
}


/* The Close Button */
.close {
    color: #aaa;
    float: right;
    font-size: 18px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}
.div-form{
	width:50%;
	float:left;
	position:relative;
}
.sub-div-form{
	width:95%;
	float:left;
	position:relative;
	padding:10px;
	border:1px solid #999999;
}
@media screen and (min-width: 200px) and (max-width: 299px){
	.login-utama{width:50%;}
}
@media screen and (min-width: 300px) and (max-width: 399px){
	.login-utama{width:45%;}
}
@media screen and (min-width: 400px) and (max-width: 499px){
	.login-utama{width:40%;}
}
@media screen and (min-width: 500px) and (max-width: 599px){
	.login-utama{width:35%;}
}
@media screen and (min-width: 600px) and (max-width: 699px){
	.login-utama{width:30%;}
}
@media screen and (min-width: 700px) and (max-width: 799px){
	.login-utama{width:25%;}
}
@media screen and (min-width: 800px) and (max-width: 900px){
	.login-utama{width:20%;}
}