body{
    height:100%;
	width:400px;
	margin:0 auto;
	font-family: "Segoe UI";
	font-size: 1em;
}

.tombol{
	margin-top:10px;
	margin-bottom:10px;
	margin:auto;
	width:910px;
	height:253px;
}

.button1{
	width:300px;
	height:20px;
	float:left;
	margin-left:10px;
	margin-top:10px;
	cursor:pointer;
	font-size:20px;
	font-weight:bold;
	padding:70px 0px 0px 0px;
	*background-color: #3db9fb;
	background-color:#3498db;
	color: white;
	border-top: 2px solid #55d5fd;
	-webkit-box-shadow: 0px 3px 0px 0px rgba(10, 150, 225, 1);
	-moz-box-shadow:    0px 3px 0px 0px rgba(10, 150, 225, 1);
	box-shadow:         0px 3px 0px 0px rgba(10, 150, 225, 1);
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	-webkit-transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-o-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
	*cursor:pointer;
}

.button1:hover {
	background-color: white;
	color:black;
	}

.button1:active {background-color: black;}

.container {
    *width: 100%;
    *border: 1px solid gray;
	background:white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1), 0 10px 10px 0 rgba(0, 0, 0, 0.19);
}

.header{
    width:400px;
	height:130px;
	background-image:url("formheader.jpg");
}

a:link {
  color: blue;
  background-color: transparent;
  text-decoration: none;
}

.show {display:block;}

.slide {
	*padding-top:10px;
    width:960px;
	height:400px;
	clear:both;
    background:#393878;
	*padding: 5px 5px 5px 5px;
	*box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1), 0 10px 10px 0 rgba(0, 0, 0, 0.19);
	z-index:-1;
}

.kiri{
	float:left;
	width:250px;
	*height:645px;
	padding:5px 5px 0px 5px;
	*background:#393878;
	*background:#ededed;
	*border: 1px solid gray;
	*box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1), 0 10px 10px 0 rgba(0, 0, 0, 0.19);
}

.informasi{
	width:238px;
	height:auto;
	*border:1px solid #B3D1EF;
	padding: 5px 5px 20px 5px;
	margin-bottom:5px;
	text-align:center;
	background:#ededed;
	border-radius:10px;
	box-shadow: 1px 1px 1px #D4D7DB;
}

.cobainformasi{
	width:236px;
	height:154px;
	border:1px solid #ededed;
}

.informasi2{
	width:238px;
	height:156px;
	*border:1px solid #B3D1EF;
	padding: 5px 5px 5px 5px;
	margin-bottom:5px;
	background:#ededed;
	border-radius:10px;
	box-shadow: 1px 1px 1px #D4D7DB;
}

.informasi2:hover{
	transition:.3s;
	box-shadow: 1px 1px 1px #215D97;
}

.informasi_abs{
	width:160px;
	height:593px;
	margin-left:523px;
	border-left:1px solid #ededed;
	position:absolute;
	*padding: 5px 5px 5px 5px;
	*background:#215D97;
}

.banner{
	width:164px;
	height:75px;
	margin-left:5px;
	margin-bottom:5px;
	text-align:center;
	color:#215D97;
	box-shadow: 1px 1px 1px #D4D7DB;
}

.banner:hover{
	background:#B3D1EF;
	transition:.3s;
	box-shadow: 1px 1px 1px #215D97;
}

.article{
	width: 515px;
	*height:700px;
	*border: 1px solid #ededed;
	*padding: 5px 5px 5px 5px;
	*float: right;
	margin-left:260px;
	margin-top:5px;
	background:white;
	position:center;
}

.tag_article{
	width:508px;
	*height:30px;
	margin-bottom:5px;
	padding-top:7px;
	padding-left:10px;
	border-bottom: 1px solid #ededed;
	*background:#215D97;
	float:left;
	*text-align:center;
	*border-radius:10px;
}

.article_container{
	width:100%;
	height:auto;
	border-bottom: 1px solid #ededed;
	float:left;
	margin-bottom:10px;
	*text-align:center;
	padding:2px 0px 5px 5px;
}

.imgarticle{
	margin:5px 0px 0px 0px;
	width:130px;
	height:130px;
	border:1px solid #ededed;
	float:left;
	*padding:5px 5px 5px 5px;
}

.imgket{
	margin:5px 5px 0px 0px;
	width:368px;
	height:130px;
	*border:1px solid #ededed;
	float:left;
	*padding:5px 5px 5px 5px;
}

.imgket_judul{
	height:20px;
	border:1px solid #ededed;
	padding:5px 5px 5px 5px;
	*background:#81AFDA;
}

.imgket_ringkasan{
	border:1px solid #ededed;
	height:93px;
	padding:0px 5px 5px 5px;
	text-align:justify;
	*background:#81AFDA;
}

.judul{
	padding:5px 5px 5px 5px;
	background:grey;
	width:690px;
	float:left;
}

.cleararticle{
	clear:both;
}

input[type=text] {
    width: 130px;
    box-sizing: border-box;
    border: 1px solid #ccc;
    border-radius: 10px;
    font-size: 16px;
    background-color: white;
    *background-image: url('searchicon.png');
    background-position: 10px 10px;
    background-repeat: no-repeat;
    padding: 10px 10px 10px 10px;
    -webkit-transition: width 0.4s ease-in-out;
    transition: width 0.4s ease-in-out;
}

input[type=password] {
    width: 130px;
    box-sizing: border-box;
    border: 1px solid #ccc;
    border-radius: 10px;
    font-size: 16px;
    background-color: white;
    *background-image: url('searchicon.png');
    background-position: 10px 10px;
    background-repeat: no-repeat;
    padding: 10px 10px 10px 10px;
    -webkit-transition: width 0.4s ease-in-out;
    transition: width 0.4s ease-in-out;
}


#footer {
	padding:5px 5px 5px 5px;
    background-color:#81AFDA;
    clear:both;
    text-align:center;
}

h1 {
	font-family: "Segoe UI";
	font-size: 23px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	line-height: 23px;
}

h3 {
	font-family: "Segoe UI";
	color:#215D97;
	font-size: 14px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	line-height: 15.4px;
}

p {
	font-family: "Segoe UI";
	font-size: 14px;
	font-style: normal;
	font-variant: normal;
	font-weight: 400;
	*line-height: 20px;
	color:#8A9197;
	*color:#fff;
}

a{
	color:#215D97;
	*text-decoration:none;
}

.pagecontainer{
	margin-left:175px;
	float:left;
}

.pagination{
	border:1px solid #ededed;
	float:left;
	padding:5px 10px 5px 10px;
	color:#5A8FC3;
	margin-right:5px;
	border-radius:5px;
}

.pagination:hover{
	*background:#ededed;
	box-shadow: 1px 1px 1px #215D97;
}

table, th, td{
	border:1px solid black;
	border-collapse:collapse;
	font-size:12px;
	padding:5px;
}

td:hover {
	background-color: #f5f5f5;
	color:blue;
	}
	
th {
    background-color: #215D97;
    color: white;
}