body{
	font-family: Arial, Helvetica, sans-serif;
  	font-size : 14px;	
	color : #993300;
	background-repeat: repeat-y;
	background-position : center;
	margin:0px;
	background-color: #00000;
}

#wrapper {
	
	width :100%;
	margin-right:auto;
	margin-left:auto;
	background-color:#FFF;
}

#wrapper #header {
	background-color: #000;
		background-repeat: no-repeat;
	margin-right: auto;
	margin-left: auto;
	height:100%;
	width:100%;
}

#wrapper #header img {
	

}

#container{
    width: 92%;
    background: white;
	border: solid;
	border-width: thin;
	border-color: grey;
	padding: 40px;
    border-radius: 12px;
	float:center;
}

#container2{
    width: 100%;
    background: #8B0000;
	padding: 10px;
    border-radius: 8px;
	float:center;
}


#wrapper #headerbantu {
	/*background-image: url(images/headerbantu.jpg);*/
	height:5px;
	width:100%;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: bold;
	color: #0FF;
	background-color:#8B0000;
	vertical-align: bottom;
	text-align: center;
	line-height: 0px;
}

#wrapper #leftcontent{
	float:left;
	width:252px;
	padding-right : 5px;
	padding-left:10px;

	color : #FFFFFF;
}

#wrapper #rightcontent{
	background-repeat: no-repeat;
	float:center;
	
	width:100%;
	padding-right:10px;
	padding-left:10px;
	line-height:155%;
	text-align:justify;
}
ul {
	padding-left:12px;
	margin-left:0px;
}
#wrapper #clearer{
	clear:both;
}
#wrapper #footer{
	clear :both;
	padding: 5px 0 10px 0px;
	font-size: 70%;
	color: #FFFFFF;
	background-color: #8B0000;
	text-align: left;
}



#wrapper #footer a:link{
         color:white;
         text-decoration:none;
}

#wrapper #footer a:visited{
         color:white;
         text-decoration:none;
}

#wrapper #footer a:hover{
         color:aqua;
         text-decoration:underline;
}

#wrapper #leftcontent a:link{
	color:#8B0000;
	text-decoration: none;
}

#wrapper #leftcontent a:visited{
	color:#FF0;
	text-decoration:none;
}

#wrapper #leftcontent a:hover{
	color:#FF0;
	text-decoration:underline;
}

#wrapper #rightcontent a:link{
	color:#EE1C24;
	text-decoration:none;
}

#wrapper #rightcontent a:visited{
	color:#EE1C24;
	text-decoration:none;
}

#wrapper #rightcontent a:hover{
	color:#EE1C24;
	text-decoration:underline;
}

.image {
	background-color: #fff;
	padding:2px;
	margin : 3px 5px 3px 0;
	border: 1px solid #ddc688;
	float:left;
}

.judul{
	font-family:Georgia;
	font-size:16px;
	line-height:170%;
	font-weight:normal;
	color:#EE1C24;
}

.date{
	font-size:10px;
	line-height:135%;
	font-style:italic;
}

.posting{
	font-size:11px;
}

.kategori{
	font-family:Verdana;
	line-height:175%;
	font-weight:bold;
	padding-left:10px;
}

input[type=text],
input[type=password]{
  width: 100%;
  padding: 6px 5px;
  margin: 4px 0;
  box-sizing: border-box;
  border: none;
  border-bottom: 2px solid grey;
}


input[type="date"],
input[type="datetime"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="time"],
input[type="url"],
input[type="button"],
textarea {
  width: 100%;
  padding: 12px 20px;
  margin: 8px 0;
  box-sizing: border-box;
  border: none;
  border-bottom: 2px solid grey;
}
input[type=text]:focus {
  background-color: lightblue;
}



select {

  width: 100%;
  padding: 12px 20px;
  margin: 8px 0;
  box-sizing: border-box;
  border: none;
  border-bottom: 2px solid grey;
}

input[type="button"],
input[type="submit"] {

	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	width: 75px;
	padding: 8px;
	text-align: center;
	border-radius: 6px;
	-webkit-border-radius:6px;
	-moz-border-radius:6px;
}


form-radio{display:none;}
form-radio + label{padding-left:35px;}
form-radio + label::before{
    content:""; 
    position:absolute; 
    left:0px; 
    display:inline-block; 
    width:25px; 
    height:25px; 
    background:#fff; 
    margin-right:5px; 
    border:1px solid #ddd; 
    border-radius:50%; -moz-border-radius:50%; 
    box-shadow:2px 2px 2px #bbb; -moz-box-shadow:2px 2px 2px #bbb;
    transition:0.3s; -moz-transition:0.3s; -webkit-transition:0.3s; -khtml-transition:0.3s;}
	
	
form-radio:checked + label::before{
    background:#34A8BF; 
    border:5px solid #fff; 
    width:17px; 
    height:17px;}
	
	
	
hr {
	border-bottom: 1px dashed #9d9d9d;
}

.isi_kecil{
	font-family:Tahoma;
	font-size:11px;
	padding-left:0px;
	color:#FF6600;
}



@media screen and (max-width: 960px) {
 
	
 
	#wrapper  {
		width: 100%;
		height: 100%;
		margin: auto;
	font-family:Tahoma;
	font-size:4px;
		
	}
#wrapper #header {
	padding-top: 0px;
		width: auto;
		height: auto;}
		
#wrapper #header img {
	width:100%;

}
		

#wrapper #headerbantu {
	/*background-image: url(images/headerbantu.jpg);*/
	height:20px;
	width:100%;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 50%;
	font-weight: bold;
	color: #FFFFFF;
	background-color:#8B0000;
	vertical-align: bottom;
	text-align: center;
	line-height: 30px;
}

	#wrapper #leftcontent{
		width: 90%;
		margin:25px auto;
		font-size:6px;
	}
	#wrapper #rightcontent{
		width: 90%;
		margin:25px auto;
		font-size:6px;
	}

	.sidebar {
		width:100%;
		margin:25px 0 0;
		float:right;
	}
 
	.sidebar .widget {
		padding:5%;
	}
 
	nav.menu ul {
		width: 100%;
	}
 
	nav.menu ul {
		float:inherit;
	}
 
	nav.menu ul li {
		float:inherit;
		margin:0;
	}
 
	nav.menu ul a {
		padding:15px;
		font-size: 16px;
		border-top:1px solid #1abf9f;
		border-bottom:1px solid #16a085;
	}
 
	.blog {
		width:90%;
	}
 
	.conteudo {
		float:inherit;
		margin:0 auto 25px;
		width:101%;
		border:1px solid #dedede;
		padding:5%;  
		background: #fff;
	}
 
	.conteudo img {
		max-width: 110%;
		margin:0 0 25px -5%;
		min-width: 110%;
	}
 
	.conteudo .continue-lendo:hover {
		margin-left:0;
	}
 
#wrapper #footer{
	clear :both;
	padding: 5px 0 10px 0px;
	font-size: 200%;
	color: #FFFFFF;
	background-color: #8B0000;
	text-align: left;
}



#wrapper #footer a:link{
         color:white;
         text-decoration:none;
}

#wrapper #footer a:visited{
         color:white;
         text-decoration:none;
}

#wrapper #footer a:hover{
         color:aqua;
         text-decoration:underline;
}

#container{
    width: 92%;
    background: white;
	border: solid;
	border-width: thin;
	border-color: grey;
	padding: 15px;
    border-radius: 12px;
	float:center;
}

#container2{
    width: 100%;
    background: #8B0000;
	padding: 5px;
    border-radius: 6px;
	float:center;
}

#footer{
	clear :both;
	padding: 5px 0 10px 0px;
	font-size: 200%;
	color: #FFFFFF;
	background-color: #8B0000;
	text-align: left;
}



}
 
@media screen and (max-width: 460px) {
 
	nav.menu ul a {
		padding:15px;
		font-size: 14px;
	}
 
	.sidebar {
		display:none
	}
	.post-info {
		display:none;
	}
 
	.conteudo {
		margin:25px auto;
	}
 
	.conteudo img {
		margin:-5% 0 25px -5%;
	}			
	
footer{
	clear :both;
	padding: 5px 0 10px 0px;
	font-size: 150%;
	color: #FFFFFF;
	background-color: #8B0000;
	text-align: left;
}





}