@charset "utf-8";
/* CSS Document */

html{
	scroll-behavior: smooth;}

body{
	margin:0;
	padding:0;
	}
	
#headergapatas{
	width:100%;
	height:202px;
	background-image:url(../image/bg-header.png);
	position:relative}
	
#headergapatas p{
	height:25px;
	width:auto;
	float:right;
	margin-right:7px;
	margin-top:10px;
	color:#F00;
	font-family:Verdana, Geneva, sans-serif;
	font-style:italic;
	font-weight:bold;
	font-size:11pt;}
	
#logoshopee{
	width:25px;
	height:25px;
	float:right;
	margin-right:15px;
	margin-top:5px;}
	
#logofacebook img{
	width:30px;
	height:30px;
	float:right;
	margin-right:15px;
	margin-top:5px;}
	
#logoinstagram img{
	width:30px;
	height:30px;
	float:right;
	margin-right:15px;
	margin-top:5px;}
	
#logoutama{
	width:320px;
	height:auto;
	margin:20px auto 10px;
	}
		
#logoutama img{
	width:320px;
	height:auto;
	}
	
#containerheader{
	margin-top:-20px;
}

.channelatas{
	max-width:950px;
	margin:0 auto;
	}
	
.channelatas img{
	float:left;
	margin-left:5px;
	margin-right:5px;
	margin-right:0;
	padding:0;
	width:32%;
}

.channelataskecil{
	max-width:380px;
	margin:0 auto;
	}
	
.channelataskecil img{
	float:left;
	margin-left:35px;
	padding:0;
	width:20%;
}

#containershoponline logoinstagram{
		width:30px;
		height:30px;}
		
#containershoponline logofacebook{
		width:30px;
		height:30px;}

@media all and (min-width: 500px) {
	.channelataskecil{
		display:none}
}
	
@media all and (max-width: 500px) {
	.channelatas{
		display:none}

}

@media all and (max-width: 750px) {
	#shoponline p{
		font-size:12px}
		
	#logoinstagram img{
	width:25px;
	height:25px;
	float:right;
	margin-right:15px;
	margin-top:5px;}
		
	#logofacebook img{
	width:25px;
	height:25px;
	float:right;
	margin-right:10px;
	margin-top:5px;}
	
	}
	
/*body section*/

#featuredcollection {
	font-family:Arial, Helvetica, sans-serif;
	font-weight:500;
	font-size:14pt;
	width:250px;
	height:auto;
	margin:20px auto 10px}
	
.flexcontainer a:link{
	text-decoration:none;}
	
#iklan1{
	max-width:800px;
	margin:30px auto 0}
	
#iklan1 img{
	width:100%;}
	
magzpic{
	max-width:300px;
	margin:0 auto}
	
#mgzpic img{
	width:100%;}
	
#magztitle{
	width:250px;
	margin:50px auto 0;
	text-align:center;
	}
	
#magztitle h1{
	font-family:Arial, Helvetica, sans-serif;
	font-size:18pt;}

#magztitle p{
	margin-top:-10pt;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12pt;}
	
/*footer*/

#myBtn {
	border:none;
	background-color:none;
	background:none; /* Hidden by default */
}

#atasfooter{
	width:80%;
	min-width:60%;
	height:auto;
	margin:20px auto 20px;}
	
#storeloc{
	float:left;
	width:360px;}
	
#storeloc img{
	margin-left:43px;}

#lofobawahcont img{
	margin: 10px 5px}

#bawahwraper{
	width:100%;
	height:auto;
	background-color:#ED1C24;
	padding-top:2px;
	padding-bottom:0;
	margin-bottom:0;
	overflow:hidden}

#menubawah{
	width:90%;
	height:auto;
	font-family:Arial, Helvetica, sans-serif;
	color:#F00;
	}
	
#menubawah ul{
	width:100%;
	list-style:none;
}
	
#menubawah li{
	float: left;
	text-align:center;
  	height:25px;
  	width:12%;
	min-width:90px;
  	list-style:none;
  	font-family:Arial, Helvetica, sans-serif;
  	font-size:14px;
	border-bottom: 2px solid #D70005;
	}
	
#menubawah li a{
	color:#FFF;}
	
#menubawah li a:hover{
	color:#FF0;
	text-decoration:none;}
	
#logofooter{
	width:100px;
	height:77px;
	margin:20px auto 0}
	
#addresfooter{
	width:100%;
	height:auto;
	padding-top:20px;
	margin-bottom:0}
	
#addresfooter p{
	color:#FFF;
	text-align:center;
	padding-bottom:5px;
	font-size:8pt;}
	
h4{
margin: 5px 0;
text-align: center;
}

/*---PRODUCTS---*/

.channelatasmini{
	width:300px;
	margin:35px auto 0;
	}
	
.channelatasmini img{
	float:left;
	margin-left:15px;
	margin-right:15px;
	margin-right:0;
	padding:0;
	width:80px;
}

#elastic_grid_demo{
	background-color:#F7F7F7}

#gbrcover{
	max-width:800px;
	margin:0 auto}
	
#gbrcover img{
	width:100%;}
	
#coverbg{
	width:100%;
	background-color:#06dce1}
	
#coverbg2{
	width:100%;
	background-color:#ffdd01}
	
#coverbg3{
	width:100%;
	background-color:#425dab}
	
/*----ABOUT----*/

#introabout{
	max-width:920px;
	margin:30px auto 0;
	}
	
#introabout img{
 	width:100%}
	
#introaboutwrapper{
	width:100%;
	background-color:#7d7e81}
	
#aboutpic{
	max-width:380px;
	margin:30px auto 0
}
	
#aboutpic img{
	width:100%;
}

/*--------------location-----*/
#namatoko{
	width:350px;
	height:20px;
	background-color:#666;
	color:#FFF;
	text-align:left;
	font-family:Verdana, Geneva, sans-serif;
	margin-top:10px;
	position:absolute;
	border-radius:0px;
	left: 0;
}
	
#namatoko p{
	margin:0;
	padding-top:2px;
	padding-left:10px;
	font-size:10pt;
	font-weight:bold}
	
.toko1 table{
	margin-top:20px;}
	
.toko1{
	font-family:Verdana, Geneva, sans-serif;
	font-size:10pt;}
	
#areatoko{
	text-align:left;
	font-family:Verdana, Geneva, sans-serif;
	font-weight:bold;
	color:#960;
	font-size:12pt}
	
.toko2 table{
	margin-top:20px;}
	
.toko2{
	font-family:Verdana, Geneva, sans-serif;
	font-size:10pt;}

#coverloc{
	width:100%;
	margin-bottom:20px;}
	
#loctitle{
	width:100%;
	height:30px;
	background-color:#7D7E81;
	color:#FFF;
	text-align:center;}
	
#loctitle p{
	font-family:Verdana, Geneva, sans-serif;
	font-size:16px;
	padding-top:5px
}

/*----article----*/

.artcontainer{
	width:auto;
	max-width:80%;
	margin:30px auto;
	}

.artbodya{
	width:auto;
	max-width:100%;
	border:1px #000 dashed;
	margin-left:20px;
	margin-right:20px;
	margin-top:20px;
	height:auto;
	min-height:190px;
	}
	
.artbodyinner h4 img{
	float:right;
	margin:10px 10px;}
	
#judulmbmagz{
	background-color:#F00;
	width:100%;
	height:auto;
	min-height:35px;
	margin-top:30px;
	}
	
#judulmbmagz p{
	font-family:Verdana, Geneva, sans-serif;
	font-size:18px;
	color:#FFF;
	text-align:center;
	padding-top:5px
	}
	
#coverpicmbmagz{
	max-width:900px;
	margin:20px auto}
	
#coverpicmbmagz img{
	width:100%;}

/*--------contact------*/

#stayupdate{
	font-family:Verdana, Geneva, sans-serif;
	color:#FFF;
	font-size:12px;
	margin:0 auto 20px;}
	
/*----------------articlesin--------------*/

#articlesin{
	width:100%;
	max-width:650px;
	height:auto;
	border:1px solid #000;
	margin:20px auto 50px;}
	
#articleinlist{
	width:100%;
	height:25px;
	background-color:#F00}
	
#articleinlist h1{
	font-family:Verdana, Geneva, sans-serif;
	margin:5px 0 0 10px;
	float:left;
	font-size:14px;
	color:#FFF;
	font-weight:bold}
	
#articlescontent{
	padding:10px 20px;
	font-family:Verdana, Geneva, sans-serif;}
	
#articlescontent h2{
	font-size: 18px;
	color:#333;
	}
	
#articlescontent p{
	font-size: 13px;
	color:#333;
	}

#articlesin img{
	text-align:center;
	vertical-align: middle;
	display:block;
	max-height:200px;
	max-width:200px;
	margin:0 auto;
	}
	
#tombolbackarti{
	position:fixed;
	right:0;
	top:300px;
}

#tombolbackartismall{
	position:fixed;
	right:0;
	top:300px;
}

@media all and (min-width: 800px) {
	#tombolbackartismall{
	display:none;}
}

@media all and (max-width: 800px) {
	#tombolbackarti{
		display:none;}
		
	#articlesin{
		margin-top:30px;}
		
	#tombolbackartismall{
	display:block;
}
	}