/*Tablet*/
@media (min-width: 765px) and (max-width: 1023px) {
	body,html{
		width: 100vw;
		overflow-x: hidden; 
	}
	.rowpad section, #footer section{
		width:740px;
		overflow-x: hidden;
	}
	.swiper-container{
		height: 250px;
	}
	#welcome{
		width: 100vw;
		text-align: center;
		margin-top: 325px;
	}
	#tentang img{
		width: 100%;
	}
	#menu .menucard{
		height: 150px;
	}
}
/*Smartphone*/
@media (min-width: 320px) and (max-width: 765px) {
	body, html{
		width: 100vw;
		overflow-x:hidden;
	}
	section{
		width: auto;
	}
	.navbar{
		width: 100vw;
		min-height: 50px;
	}
	.logo{
		left: -15px;
		font-size: 17px;
		padding: 16px 25px;
	}
	.logo.singitan{
		left: -250px;
	}
	.logo img{
		height: 30px;
	}
	.swiper-container{
		height: 225px;
	}
	#header{
		height: 225px;
	}
	.l1{
		height: 75px;
		margin: 5px;
	}
	.l2{
		height: 45px;
	}	
	#welcome .col-md-12{
		font-size: 15px;
	}
	#jam{
		top: 265px;
		font-size: 13px;
		padding: 10px 20px;
		right: -10px;
	}
	.line{
		height: 1px;
		margin-bottom: 15px;
	}
	p.sp{
		font-size: 12px;
		text-indent: 40px;
		padding: 10px;
	}
	.subtitle{
		padding-top: 20px;
	}
	.subtitle p{
		font-size: 20px;
	}
	.newspanel{
		height: auto;
	}
	.newspanel .panel-heading{
		height: 120px;
	}
	.newspanel p.font-sm{
		font-size: 16px;
	}
	.newspanel p.font-xs{
		font-size: 12px;
	}
	#footer .font-lg{
		font-size: 22px;
	}
	#footer .font-sm{
		font-size: 12px;
	}
	.readberita .panel-body{
		padding: 20px;
	}
	.readberita .panel-body img{
		width: 95%
	}
}