#menu {position: fixed; top: 0; right:0; width: 100%; min-height: 50px ; overflow: hidden; z-index: 300; color: white; background-color:rgba(50, 50, 50, 0.3);}
#menu.no_ban {color: white; background-color: rgb(50,50,50); }

#ban {position: relative ; width : 100% ; height:107% ; max-height : 680px ; background-color:rgb(160,160,160) ; pointer-events: none; 
	background-image: url("gambar.php?a=1");  background-position: 50% 50% ; background-repeat: no-repeat; background-attachment: scroll; 
	background-size:cover; padding:50px 5% 0 5%; text-align:center; }

.ban_tag { max-width:700px; color:white;  position: absolute ; left: 9%; top: 48%;
	transform: translate(0,-40%); -ms-transform: translate(0,-40%); -webkit-transform: translate(0,-40%); } 
#ban_tag_moto { max-width:400px ; font-family: tagline; font-size: 28px; line-height: 170%; margin:20px auto 0 auto ; line-height: 110%;}

h1 {font-family: banner ; font-size: 40px; font-weight:normal ; line-height: 100%; color:white; margin:0;} 
.tagline { font-family: tagline; font-size: 28px; line-height: 100%; color:rgb(0,255,255);  padding-top:20px; display:block;} 
p { margin-top:0; margin-bottom:20px ;} 
li { margin-bottom: 2px ;}
ul { margin-top:0; margin-bottom: 20px ; }
ol { margin-top:0; margin-bottom: 20px ;}
	
@media screen and (max-width: 960px ) {
	#menu {background-color:transparent; }
	#ban { background-position: 45% 50% ; }
	.ban_tag {left:4%; }
 } 

@media screen and (max-width: 515px ) {
	/* font banner, bakground gelap - hp portrait */
	h1 { font-size: 34px; }
	#ban_tag_moto { font-size: 26px; line-height: 150%; }
    .ban_tag { left:1%; }
}