@charset "utf-8";
/* CSS Document */
body {
	font-family:Geneva, Arial, Helvetica, sans-serif;
}
.top {
	position:fixed;
	top:0;
	right:0;
	left:0;
	height:60px;
	width:auto;
	box-sizing:border-box;
	background-color:#CC0033;
	box-shadow:0 0 5px rgba(0,0,0,0.2);
	z-index:1;
}
.top table {
	width:100%;
	height:100%;
	border-collapse:collapse;
}
.top table td{
	padding:5px;
	vertical-align:middle;
}
.middle {
	position:absolute;
	width:auto;
	height:auto;
	margin:auto;
	top:60px;
	right:0;
	bottom:60px;
	left:0;
	background-color:#FFFFFF;
	box-sizing:border-box;
	padding:10px;	
	overflow:auto;
}
.modal{
	display:none;
	position:fixed;
	width:100%;
	height:auto;
	top:0;
	right:0;
	bottom:0;
	left:0;
	z-index:1;
	background-color:#FFFFFF;
	padding:10px;
	overflow:auto;
}
#modal_content1{
	width:100%;
	width:100%;
	box-sizing:boorder-box;
	overflow:auto;
}
.kategori-content{
	position:static;
	box-sizing:border-box;
	height:200px;
	width:100%;
	overflow:auto;
}
.kategori-slide{
	position:static;
	box-sizing:border-box;
	height:200px;
	width:925px;
}
.kategori-content2{
	position:static;
	box-sizing:border-box;
	height:500px;
	width:100%;
	overflow:auto;
}
.kategori-slide2{
	height:500px;;
	width:100%;
	position:static;
	box-sizing:border-box;
	width:100%;
	overflow:hidden;
	border:solid 1px #EBEBEB;
	background-color:#F0F0F0;
}
.kategori-slide2 img {
	width:100%;
	height:auto;
	max-height:500px;
	object-fit: contain;
}
.container-catalog {
	float:left;
	position:static;
	width:180px;
	height:100%;
	float:left;
	box-sizing:border-box;
	overflow:hidden;
	border:solid 1px #EBEBEB;
	margin-right:5px;
	border-radius:5px;
}
.container-catalog-img{
	float:left;
	height:125px;
	width:100%;
	vertical-align:middle;
	overflow:hidden;
}
.container-catalog-desc {
	float:left;
	width:100%;
}
.container-catalog-desc table{
	width:100%;
	border-collapse:collapse;
}
.container-catalog-desc table td{
	padding:5px;
}

.container {
	margin: 0 auto;
	max-width:1080px;
	min-width:360px;
}
.container-catalog2 {
	display:inline-block;
	width:155px;
	height:200px;
	float:left;
	box-sizing:border-box;
	overflow:hidden;
	border:solid 1px #EBEBEB;
	margin:5px;
	border-radius:5px;
}
.container-catalog2-img{
	height:125px;
	width:100%;
	overflow:hidden;
}
.container-catalog2-img img{
	height:125px;
	width:auto;
	object-fit: contain;
}
.bottom {
	position:fixed;
	right:0;
	bottom:0;
	left:0;
	height:60px;
	width:auto;
	box-shadow:0 0 5px rgba(0,0,0,0.2);
	box-sizing:border-box;
	background-color:#FFFFFF;
}

.bottom table{
	width:100%;
	border-collapse:collapse;
	height:100%;
}
.bottom table td {
	vertical-align:middle;
	font-size:9px;
}
.bottom table td:hover {
	background-color:#F4F4F4;
}
.modal-transparan{
	display:none;
	position:fixed;
	top:0;
	right:0;
	bottom:0;
	left:0;
	z-index:1;
	padding:10px;
	background-color: rgb(0,0,0); /* Fallback color */
	background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
.modal-transparan-content{
	position:absolute;
	width:250px;
	height:auto;
	top:0;
	bottom:0;
	right:0;
	background-color:#FFFFFF;
	padding:10px;
	overflow:auto;
	z-index:1;
}
.next {
	background-image:url(images/next.png);
	height:16px;
	width:16px;
	position:absolute;
	margin:auto;
	top:0;
	bottom:0;
}
.prev {
	background-image:url(images/prev.png);
	height:16px;
	width:16px;
	position:absolute;
	margin:auto;
	top:0;
	bottom:0;
}

.container-carousel {
	position:static;
	float:left;
	width:100%;
	max-height:500px;
}