/* font google */
@font-face {
  font-family: 'meriendaregular';
    src: url('../../fonts/google-font/Open_Sans/merienda-regular-webfont.woff2') format('woff2'),
		 url('../../fonts/google-font/Open_Sans/merienda-regular-webfont.woff') format('woff');
}
@font-face {		 
  font-family: 'kaushan_scriptregular';
    src: url('../../fonts/google-font/Open_Sans/kaushanscript-regular-webfont.woff2') format('woff2'),
         url('../../fonts/google-font/Open_Sans/kaushanscript-regular-webfont.woff') format('woff');
}
@font-face {		 
  font-family: 'akbaal-webfont';
    src: url('../../fonts/google-font/Open_Sans/akbaal-webfont.woff2') format('woff2'),
         url('../../fonts/google-font/Open_Sans/akbaal-webfont.woff') format('woff');
}
@font-face {		 
  font-family: 'Roboto-Regular';
    src: url('../../fonts/google-font/Open_Sans/Roboto-Regular.woff2') format('woff2'),
         url('../../fonts/google-font/Open_Sans/Roboto-Regular.woff') format('woff');
}
@font-face {		 
  font-family: 'Roboto-Italic';
    src: url('../../fonts/google-font/Open_Sans/Roboto-Italic.woff2') format('woff2'),
         url('../../fonts/google-font/Open_Sans/Roboto-Italic.woff') format('woff');
}

/* Header */
.container-lg h9{
	font-family: 'kaushan_scriptregular';
	/* font-style: italic; */
	font-size: 17px;
}
.container-lg h9:hover{
	text-shadow: 6px 6px 10px greenyellow;
}
/* navbar */
.navbar {
	background-image: linear-gradient(#1d9200, #49c211);
	background: -webkit-linear-gradient(top,  #1d9200 0%,#49c211 100%); /* Chrome10+,Safari5.1+ */
	box-shadow: 0 3px 20px rgba(1, 105, 41, 0.5);
}
.navbar-brand, .nav-link {
    color: white !important;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
	cursor:pointer;
  } 
.nav-link {
    text-transform: uppercase;
	margin-right: 20px;
	
  }
.nav-link:hover::after {
    content: '';
	display: block;
    border-bottom: 2px solid #ffffff;
    width: 30%;
	margin: auto;
    padding-bottom: 3px;
    margin-bottom: -6px;
  }
.nav-link:hover {
	text-shadow: 6px 6px 10px greenyellow;
  }

  #header ul li a{
	display:block;
	line-height:15px;
	cursor:pointer;
	font:normal 16px Tahoma,Verdana;
	font-weight: 500;
} 
/* alhir navbar */
body{
 font-family: Verdana,Tahoma,sans-serif;
 font-size: 11pt;
 color:#006308;
 background-color: #cffac2f1;
}
/* ----------- card armada --------------- */
.container {
	text-align: center;
	align-items: center;
	align-self: center;
	align-content: center;
	border-radius: 10px;
}
.container .card {
	background-image: linear-gradient(#1d9200,#49c211);
	background: -webkit-linear-gradient(top,  #1d9200 0%,#49c211 100%); /* Chrome10+,Safari5.1+ */
	box-shadow: 0 3px 20px rgba(1, 105, 41, 0.5);
	color: #FFFFFF;
	padding: 5px 5px 5px 5px;
	text-align: center;
	align-items: center;
	border-radius: 10px;
}
.container .card a{
	align-self: center !important;
	align-content: center !important;
	align-items: center !important;
	text-align: center !important;
	cursor: pointer;
}
.container .card a img{
	width: 150px;
	align-items: center;
	align-self: center;
	border-style: solid;
	border-color: rgba(0, 255, 170, 0.4);
	border-width: 5px;
}
.container .card .card-header{
	align-items: center;
	align-self: center;
	color: aquamarine;
}
.container .card h9.judul{
	font-weight: bold;
	font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
	text-align: center;
	font-size: 16px;
}
.container .card h9.sub{
	font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
	text-align: center;
	font-size: 11px;
}
.container .card h9.jbtn{
	font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
	text-align: center;
	font-size: 16px;
	padding-top: 10px;
	font-weight: bold;
	text-transform: uppercase;
}
.container .card h9.nik{
	font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
	text-align: center !important;
	font-size: 15px;
	padding-top: 10px;
	font-weight: bold;
	text-transform: uppercase;
}
.container .card h9.footer{
	font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
	text-align: center !important;
	font-size: 11px;
	padding-top: 10px;
	color: #FFFFFF;
}
.container .card h5 {
	text-align: center;
	color: #FFFFFF;
	font-weight: bold;
	font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
	text-transform: uppercase;
	font-size: 16px;
} 
.container .card p{
	color: #FFFFFF;
	font-weight: normal;
	padding: 0;
} 
.container .card .text-muted{
	/* font-style: italic; */
	text-align: center !important;
	font-size: 12px;
} 
.container .card .card-body{
	padding: 5px 4px 2px 4px;
}  
  /* ------------------footer----------------- */
#footer {
	background-image: linear-gradient(#49c211,#1d9200);
	background: -webkit-linear-gradient(top,  #49c211 0%,#1d9200 100%); /* Chrome10+,Safari5.1+ */
	box-shadow: 0 3px 10px rgba(1, 105, 41, 0.5);
	height: 50px;
	font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
}
/*  --------------------menu------------------------ */
	.utama a:hover {
		border:solid 0px #fffb19;
 		color:#fffb19;
		cursor:pointer;
	} 

	.utama ul li.active{
	color:#fffb19;
	font-weight:bold;
	display:block;
	}
	.utama  > a {
      display: block;
      padding-top: 4px;
      padding-bottom: 4px;
      padding-left: 4px;
      margin: 0;
      margin-bottom: 4px;
	  color: rgb(255, 255, 255);
	  text-shadow: 1px 1px 1px rgba(0, 34, 13, 0.5);
	  background-image: linear-gradient(#49c211,#1d9200);
	  background: -webkit-linear-gradient(top,  #49c211 0%,#1d9200 100%); /* Chrome10+,Safari5.1+ */
	  text-decoration: none;
	  box-shadow: 0 3px 10px rgba(1, 105, 41, 0.5);
	  border-radius: 4px;
	  cursor:pointer;
   }
   
   .utama ul {
        display:none;
        position:absolute;
        border:1px solid #aaa;
        border-left:1px solid #ccc;
        margin-left:60px;
        margin-top:-28px;
        background-color: #cffac2f1;
        font-size: 0.8em;
   }
	.smenu > a {
		display: block;
		padding-top: 5px;
		padding-bottom: 5px;
		padding-left: 4px;
		margin: 0;
		margin-top: 10px;
		margin-bottom: 3px;
		text-decoration: none;
		color: rgb(255, 255, 255);
		text-shadow: 1px 1px 1px rgba(0, 44, 0, 0.5);
		background-image: linear-gradient(#4db444,#00660e);
		background: -webkit-linear-gradient(top,  #4db444 0%,#00660e 100%); /* Chrome10+,Safari5.1+ */
		text-decoration: none;
		box-shadow: 0 3px 10px rgba(1, 105, 15, 0.5);
		border-radius: 4px;
 	}
   ul#menu0 {
	   color: #000;
	   font-weight: bold;
	   font-family: Arial, Helvetica, sans-serif;
	   font-size: 12px;
	   list-style-type: none;
	   padding-left: 5px;
   }
   ul#menu0 li.utama {
	   color: #000;
	   font-weight: normal;
	   font-size: 12px;
	   color: #FFF;
	   font-family: Arial, Helvetica, sans-serif;
	   list-style-type: none;
	   /* padding-left: 5px; */
   }
   ul#menu0 li.utama a{
	   text-decoration: none;
   }
   .utama ul li a {
      display: block;
      padding-top: 5px;
      padding-left: 4px;
      margin: 0;
      color: #000;
      list-style:none;
      text-decoration: none;   
   }
/* pop up login */
.pheader {
	height: 30px;
	width: 250px;
	background-image: linear-gradient(#49c211,#1d9200);
	background: -webkit-linear-gradient(top,  #49c211 0%,#1d9200 100%); /* Chrome10+,Safari5.1+ */
	font-size: 14px;
	color: #FFF;
	font-family: Arial, Helvetica, sans-serif;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
	vertical-align: center;
	padding-top: 5px;
	font-weight: bold;
	border-radius: 5px;
}
.pkonten {
	height: auto;
	background-color: #cffac2f1;
	width: 248px;
	padding-left: 20px;
	padding-right: 20px;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}
.pfooter {
	border-radius: 5px;
	background-color: #cffac2f1;
	width: 250px;
	background-image: linear-gradient(#49c211,#1d9200);
	background: -webkit-linear-gradient(top,  #49c211 0%,#1d9200 100%); /* Chrome10+,Safari5.1+ */
	height: 25px;
}