@font-face {font-family: 'roboto';font-style: normal;font-weight: 400;src: local('roboto'), local('roboto-Regular'), url(cyrillic.woff2) format('woff2');unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face {font-family: 'roboto';font-style: normal;font-weight: 400;src: local('roboto'), local('roboto-Regular'), url(latin-ext.woff2) format('woff2');unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;}
@font-face {font-family: 'roboto';font-style: normal;font-weight: 400;src: local('roboto'), local('roboto-Regular'), url(latin.woff2) format('woff2');unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;}
::-webkit-scrollbar {width: 3px; height:3px;}
::-webkit-scrollbar-track {    background-color: rgba(255,255,255,0.41);    border-left: 0px solid rgba(255,255,22255,0.11);}
::-webkit-scrollbar-thumb {    background-color: rgba(39,61,68,0.89); border-radius:3px;}
::-webkit-scrollbar-thumb:hover {	background-color:rgba(39,61,68,0.99);}
a,a:hover{text-decoration:none; cursor:pointer; color:#333;}

body{padding:103px 0 0 0; margin:0; overflow-x:hidden; font-family:robot !important; position:relative;}

body:before{content:'';  position:fixed; top:0; left:0; right:0; bottom:0; z-index:0; opacity:.11;}
body > .content-wrapper > section > .container{padding:0; margin-top:49px; margin-bottom:21px; border-radius:5px;}
body  .container.pageHead{margin-top:49px; margin-bottom: -49px;}

body,h1,h2,h3,h4,h5,h6{font-family:roboto !important; }
.wrapper{width:100%; text-align:center; position:relative; z-index:1;}
.container{ margin:0 auto; text-align:left; position:relative; z-index:1; padding:0 9px;}
.container > .p-1 {padding:3px;}
.container > .p-1 .panel,.container .p-1 .box{margin-bottom:6px; background-color:rgba(255,255,255,.71); overflow:hidden; box-shadow: 0 0 5px 0 rgba(0,0,0,.11);}


.NUBreakBox{color:#fff; max-width:100%; text-align:center; padding:11px 0; margin:0; position:relative; z-index:2;}
.NUBreakBox .container{ display:block; text-align:center; position:relative; z-index:0;}
.NUBreakBox+section{position:relative; z-index:3;}	

.NUBreakBoxs{max-width:100%; text-align:center; border-radius:0; position:relative; z-index:2; padding:0;}
.NUBreakBoxs.shadow{ box-shadow:0 0 3px rgba(0,0,0,.21);}
.NUBreakBoxs.overflow{ overflow:hidden; }

.divScrooler{max-height:393px; overflow-y:scroll; overflow-h:hidden;}
 

@media print {
	header,body:after,footer{display:none;}
	body,.wrapper,.container{padding:0; background:#fff;}
}
.indexLoad{ font-family:roboto !important; }

header{ border-bottom:solid 1px rgba(255,255,255,.21); padding:0; height:104px; position:fixed; top:0; left:0; right:0; z-index:999;  transition:all .41s; }
header > .logo{position:relative; z-index:9 !important;}
header > .logo a{position:absolute; top:-37px; left:0; }
header > .logo a .brand{position:relative; z-index:3; transition:all .41s; float:left; }
header > .logo a h1,header > .logo a h6,header > .logo a h2,header > .logo a h3,header > .logo a h4,header > .logo a h4 b,header > .logo a h5{ color:#fff !important; width: 343px; white-space:nowrap; opacity: 1;  transition:all .71s ease;}
header > .logo a h4{position: absolute; bottom: 0; left: 0; }
header section{line-height:33px; height:33px; position:relative; background-color:rgba(0,0,0,.49); z-index:3;}
header section:before{position:absolute; top:0; left:0; right:0; bottom:0; content:''; z-index:0;}
header section ul{padding:0; margin:0 9px 0 0; display:inline-block; position:relative;}
header section ul li{list-style:none; padding:0; margin:0; display:none; position:relative;}
header section ul li a{color:#FFFFFF; font-size:12px; font-weight:normal !important; padding:0 11px; z-index:1; position:relative;}
header section ul li a:hover{color:#D1D1D1 !important;}
header section ul li a .caret{margin:0 9px 0 1px; opacity:.71;}
header section ul#menuheader > li{margin:0;}
header section ul#menuheader > li+li{display:inline-block;}
header section ul#menuheader > li+li+li a{ border-left:solid 1px #fff;}
header section ul#menuheader > li:hover > a{}
header section ul#menuheader li ul{ line-height:15px; opacity:0; display:block; overflow:hidden; position:absolute; top:31px; left:11px; max-height:0; transition:all .41s; min-width:191px; background-color:rgba(0,0,0,.71);}
header section ul#menuheader li ul li ul{top:0; left:100%;}
header section ul#menuheader li ul li,
header section ul#menuheader li ul li a{display:block;}
header section ul#menuheader li:hover > ul{max-height:786px; opacity:1; overflow:visible;}
header section ul#menuheader li ul li a{padding:9px; text-align:left; white-space:nowrap;}
header section ul#menuheader li ul li a{border-top:solid 1px rgba(255,255,255,.21);}

header section ul.menusys li{display:inline-block; color:#fff;}
header section ul.menusys li a{font-size:13px; padding:9px 9px 5px 9px; background-color:#fff; border-radius:0 0 5px 5px; transition:background-color .41s;}
header section ul.menusys li a:hover{background-color:#fff;} 

header > .container{ position:relative; z-index:1;}
header nav{text-align:right;}
header nav ul{padding:0; margin:0; font-size: 0;}
header nav ul li{list-style:none; display:inline-block; margin:0; padding: 0; position:relative;}
header nav ul li a{border-bottom:solid 5px transparent; display:block; white-space:nowrap; color:#fff; height: 71px; line-height: 71px; padding:0 9px; font-size:15px; transition:all .41s; position:relative; z-index:3;}

header nav ul li a span{position:relative; z-index:1;}
header nav > ul > li > a:before{position:absolute; top:71px; left:-5px; right:-5px; bottom:3px; content:''; border-radius:3px; z-index:0; transition:all .41s ease-in; background-image:url(../../files/system/icon/down.png); background-size:0px auto; background-position:center top 49px; background-repeat:no-repeat;}
header nav ul li:hover > a:before,header nav ul li a.active:before{top:3px; background-size:21px auto; background-color:#fff;}
header nav ul li:hover > a,header nav ul li a.active{ border-color:#fff !important; }
.menuOpen{display:none;}
header nav ul li ul{top:71px; right:-3px; bottom:auto; max-height:0; overflow:hidden; transition:all .71s; padding:0; border-radius:3px; position:absolute; min-width:313px; background-color:rgba(0,0,0,.91); }
header nav ul li ul li{display:block; position:relative;}
header nav ul li:hover ul{ opacity:1; max-height:999px; padding:9px 0;}
header nav ul li ul li a{padding:0 9px; margin:0; line-height: 41px; height: 41px; border-top-width:1px !important; border-bottom-width:1px !important; font-size:12px; text-align:left;}
header nav ul li ul li a .pull-right{padding-top: 13px;}
header nav ul li ul li ul{ display:none; top:-9px !important; right:0% !important; left:auto; max-width:0px; opacity:0; transition:all .41s;}
header nav ul li ul:hover{overflow:visible;}
header nav ul li ul li:hover ul{display:block; opacity:1; right:100% !important; margin-right:0px;}


header.top{top:-33px; background-color:#b80002;}
header.top > .logo a .brand{height:37px; margin:41px 3px 0 0;}
header nav .menuOpen{display: none; position:absolute; padding:0 11px !important; line-height: 67px; width: 71px; height: 67px; background-color: transparent; top:0; right:0; z-index:9; border: none; color:#fff !important;}
header nav .menuOpen > i{font-size: 33px;}
header nav .menuOpen:hover{background-color: transparent;}
@media screen and (max-width: 786px){
	header section ul{display:none; }
	header section ul.menusys{display:inline-block;}
	header nav .menuOpen{display:block; }
	header nav{padding-top:67px; left:0;}
	header nav > ul{background-color:rgba(0,0,0,.91); display:none; position:fixed; top:103px; left:0; right:0; bottom:0; overflow-y:scroll; padding:3px 3px 41px 3px; }
	header.top nav > ul{top:41px;}
	header nav ul.open{display:block;}
	header nav ul li{display:block;}
	header nav ul li a{border:none !important; padding:9px 9px !important; display:block; text-align:left; font-size:12px !important; color:#fff !important;}
	header nav ul li+li a{border-top:solid 1px rgba(255,255,255,.11);}
	header nav ul li a:before{display:none;}
	header nav ul li ul,header nav ul li:hover ul,
	header nav ul li ul li ul,header nav ul li ul li:hover ul{overflow:visible; display:block; padding:5px 0 0 25px; position:relative; height:auto; max-height:none; background-color:transparent !important; opacity:1; width:100%; top:0; left:0; right:0;}
	header nav ul li ul li ul,header nav ul li ul li:hover ul{padding:11px 0 0 29px !important;}
}


.slidebox{padding:11px 0 !important; position:relative !important;}

.carousel-fade .carousel-inner .item { transition-property: opacity; }
.item,.active.left,.active.right {	opacity: 0;}
.active,.next.left,.prev.right {	opacity: 1;}
.next,.prev,.active.left,.active.right {	left: 0;	transform: translate3d(0, 0, 0);}
.carousel-control { z-index: 2; }


#toTop{position:fixed; bottom:21px; right:9px; display:none; z-index:997;}





body > footer > .footer{min-height: 313px; display:block; z-index: 1; font-size: 15px; box-shadow: 0 -9px 9px 0 rgba(0,0,0,.21); line-height: 21px; position: relative; color: #fff; padding: 21px 0; overflow: hidden;  background-position: top center; }
body.loadedIn > .footer{margin-right: 313px;}
body > footer > .footer .container{position: relative; z-index: 1;}
body > footer > .footer .container .row > span{display: block; text-align: center; padding: 21px 0 0 0; display: inline-block; z-index: 9;}
body > footer > .footer .container .row > span img{height: 21px; vertical-align: bottom;}



body > footer > .footer .identitas,body > footer > .footer .alamat,body > footer > .footer .link,,body > footer > .footer .develope{position: relative; z-index: 9;}
body > footer > .footer .identitas {display: block; position: relative; margin: 0 0 9px 0; padding: 3px 0 0 49px; }
body > footer > .footer .identitas img{width: 41px; position: absolute; left: 0; top: 0;}
body > footer > .footer .identitas h1,body > footer > .footer .identitas h2,body > footer > .footer .identitas h3,body > footer > .footer .identitas h4,body > footer > .footer .identitas h5,body > footer > .footer .identitas h6{margin: 0; padding: 0; font-size: 17px; line-height: 21px; }
body > footer > .footer .identitas b{display: block;}
body > footer > .footer .identitas p{margin: 0 0 9px 0;}
body > footer > .footer a{position: relative; display: block; padding: 9px 0 0 21px; cursor: pointer; color: #fff;}
body > footer > .footer a:hover{color: #fc0;}
body > footer > .footer a i{position: absolute; left: 0; top: 11px; width: 21px; text-align: center;}
body > footer > .footer a span{opacity: .41;}
body > footer > .footer a.sub{padding: 9px 0 0 41px; }
body > footer > .footer a.sub i{left: 21px;}
body > footer > .footer .partner{border-left: solid 9px rgba(255, 255, 255, .21); padding: 0; text-align: left;}
body > footer > .footer .partner a{display: inline-block; margin:0 0 0 9px; padding: 3px 9px; box-shadow: inset 0 7px 5px rgba(0, 0, 0, .21), 0 -7px 5px 0 rgba(0, 0, 0, .21); border-bottom: solid 1px rgba(255, 255, 255, .99); background-color: rgba(255,255,255,.71);  transition: all .41s; border-radius: 5px;}
body > footer > .footer .partner a:hover{background-color: rgba(255,255,255,.41); box-shadow: inset 0 -7px 5px rgba(0, 0, 0, .21), 0 7px 5px 0 rgba(0, 0, 0, .21); }
body > footer > .footer .partner a img{height: 41px; display: block;}
body > footer > .footer .waveWrapper{opacity: .21;}




.A4 .page .kop{font-family:times !important; display:block; position:relative; border-bottom:solid 1px #999; margin:0 0 9px 0; padding:0 11px 9px 11px; text-shadow: 0 0 3px rgba(0,0,0,0.11); }
.A4 .page .kop h3,.A4 .page .kop h4{font-family:times !important; line-height:100%; margin:3px 0; text-transform:uppercase; font-weight:bold;}
.A4 .page .kop .logo{width:99px; margin:-11px 11px 0 0;}
.A4 .page .dataView{display:block; padding:11px 21px; font-size:15px;}
.A4 .page .dataView span{display:inline-block; padding:1px 21px; width:33%; vertical-align:top;}
.A4 .page .dataView strong{display:inline-block; padding:1px 0; width:65%; vertical-align:top;}
.A4 .page .dataView h5{padding:0 21px;}
.A4 .page .photo{width:111px; height:131px; margin:0 11px 0 0; vertical-align:bottom; border-radius:4px; border:solid 1px rgba(0,0,0,.71); display:inline-block; float:left; background-position:center center; background-size:cover;}

.labelSelect{position:relative; margin:1px 0; font-weight:bold;}
.labelSelect small{margin:0 0 0 11px;}
.labelSelect input[type=checkbox]{position:absolute; top:0; left:0; opacity:0;}
.labelAdd > div > button{width:33px; padding:6px 0;}
.labelAdd > div > button > .caret{position:absolute; right:1px; bottom:1px; font-size:15px;}




.siswalist{position:relative;}
.siswalist li{position:relative; border-radius:3px;}
.siswalist li:hover{background-color:rgba(0,0,0,.03);}
.siswalist li .opt{position:absolute; top:3px; left:3px;}
.siswalist li img{width:71px; height:71px;}

.alamat{z-index:11;}
.list-autocomplate{position:absolute; bottom:37px; right:5px; padding:0; z-index:9; left:5px; border-radius:4px 4px 0 0; background-color:#fff; box-shadow:0 0 3px rgba(0,0,0,.21); margin:0 !important; padding:0 !important; border:none !important;}
.list-autocomplate > button{border-radius:0; margin:0; border:none;text-align:left;}
.list-autocomplates{position:relative; padding:2px 3px; border:solid 1px #ccc; border-radius:4px;}


.article{display:block; min-height:141px; overflow: hidden; border-radius: 9px; padding:0; height: 100%;  color:#999; line-height:21px; background-color:transparent !important; border: solid 3px #fff; box-shadow: 0 0 5px 3px rgba(0, 0, 0, 0.11); position: relative;}
.article a.kat{display:inline-block; font-size:11px; line-height: 17px; border-radius: 3px; color: #fff !important; cursor: pointer; padding: 0 5px; text-transform:capitalize; margin:1px; background-color: #999;}
.article > h4{margin:11px 9px 0px 71px; padding:0; font-size:15px; line-height:21px; min-height:63px; max-height: 66px; overflow:hidden; text-overflow: ellipsis; font-weight:700; }


.article > span{ min-height:141px;  overflow:hidden; position: relative;  background-position:center center; background-repeat:no-repeat; background-size:cover; display: block; margin:0; transition:height .41s; box-shadow:0 3px 3px 0px rgba(0,0,0,.21); background-color:#999;}

.article > b{display: inline-block;  background-color: #999; color:#fff ; position: absolute; width: 55px; left: 5px; top:151px; text-align: center; overflow: hidden; height: 66px; padding: 3px 0; border-radius: 3px; border: solid 1px #999;}
.article > b span{display: block; line-height: 15px; padding-top: 9px; font-size: 15px;}
.article > b span+span{font-size: 11px; padding: 0; line-height: 19px; text-transform: uppercase;}
.article > b span+span+span{background-color: #fff; color: #333; margin: 1px 0 0 0; line-height: 17px;}
.article > b:before {content: "\f111";position: absolute;left: 3px; top: 3px;font-size: 9px; line-height:9px; font-family: FontAwesome;}
.article > b:after {content: "\f111";position: absolute;right: 3px;top: 3px;font-size: 9px; line-height:9px; font-family: FontAwesome;}


.article > p{padding:5px; margin:0; font-weight:normal; overflow:hidden; max-height: 131px; text-overflow: ellipsis; font-size:14px; }
.article > p small{display:block; text-align: left; max-height: 15px; margin: 3px 0; padding: 0;}
.article > small{display:inline-block; white-space:nowrap; font-size:11px; line-height:11px; margin:0 3px 7px 0;}
.article > p > b{font-weight:100;}


.article > small{display:block; margin:3px 0;}
.article > small .postAuthor{position:relative; z-index:999; margin:0; min-width:71px; padding:0; text-align:center; float:left; height:33px; transition:all .41s;}
.article > small .postAuthor .picAuthor{position:relative; margin:-13px 0 -7px 0; width:33px; height:33px; border-radius:99%; display:inline-block; background-size:cover; border:1px solid #eee; box-shadow:1px 1px 3px rgba(0,0,0,.21); transition:all .41s;}
.article > small .postAuthor .nameAuthor{display:block; text-shadow:1px 1px 3px rgba(0,0,0,.21); background-color:rgba(255,255,255,0); border-radius:3px;}
.article > small .postAuthor:hover{margin:0 -7px 0 7px;}
.article > small .postAuthor:hover .picAuthor{width:99px; height:99px; margin:-11px -41px -3px -41px; border-radius:5px; box-shadow:3px 3px 9px rgba(0,0,0,.41);}
.article > small .postAuthor:hover .nameAuthor{background-color:rgba(255,255,255,.71);}
.article > small small a{display:inline-block;}


    .pagerBtn{box-shadow: 0 5px 5px 3px rgba(0,0,0,.41);}

.boxLists{ font-size: 11px; border-radius: 9px; border: 5px solid #fff !important; box-shadow: rgba(0, 0, 0, 0.01) 0px 10px 20px, rgba(0, 0, 0, 0.11) 0px 6px 6px; overflow: hidden; }
.boxLists .nav,.boxLists .nav li,.boxLists .nav li a{display:block; padding: 0 !important; min-height:71px; width:100% !important;}
.boxLists .nav li a{padding: 9px !important;}
.boxLists .nav li a img{float:left; height:55px; margin:0 9px 0 -9px;}
.boxLists .nav li a h5{ height:15px; font-size: 11px; line-height: 15px; white-space:nowrap; overflow:hidden; text-overflow: ellipsis; margin:0;}
.boxLists .nav li a small{ max-height:21px; font-size:11px; line-height:11px; padding:0; display:block; overflow:hidden; margin:5px 0;}
.boxLists .box-footer.p-1 {height:247px; border-radius:4px 4px 0 0; overflow:hidden; padding:79px 9px 21px 9px !important; position:relative;}
.boxLists .box-footer.p-1 img{ max-height:111px; position:absolute; top:0; right:0; border-radius:0 4px 0 99%;}
.boxLists .box-footer.p-1 img.icon{ position:relative; display:inline-block; top:auto; max-height:41px; margin:11px 0; right:auto; border-radius:0;}
.boxLists .box-footer.p-1 > a{color:#fff;}
.boxLists .box-footer.p-1 > a.btn{position:absolute; top:33px; font-size: 13px; left:-5px; right:0; text-align:left; background-color:rgba(0,0,0,.71) !important; }
.boxLists .box-footer.p-0 .btn-block{color:#fff !important; padding: 3px !important; font-size: 11px; width: 100%;}
.boxLists .box-footer h5{line-height:21px !important; font-size: 15px;}
.boxLists .box-footer h5+h5{width:100%; font-size: 13px; max-height: 63px; overflow: hidden; text-overflow: ellipsis;}
.boxLists .box-body{padding:0px !important; display: block; position: relative;}
.boxLists author{font-size:11px; margin:0; line-height:11px; display:inline-block; padding:2px 3px; border-radius:3px; border:solid 1px rgba(0,0,0,.11);}

.loader{ position:relative; min-height:71px; }
.loader:after{position:absolute; top:0px; left:0px; right:0px; bottom:0px; background:transparent; background-size:21px 21px; z-index:97; content:''; border-radius:3px;}
.loader::before{position:absolute; top:41px; left:41px; right:41px; text-align:center; color: #999; font-family: roboto; font-size: 17px; z-index:99; content:'...'; border-radius:3px;}



.sponsor{background-position:center center; display:block; overflow:hidden; background-repeat:no-repeat; position:relative; margin:0; cursor:pointer; text-align:center; min-height:90px;}
.sponsor *{z-index:3; position:relative;}
.sponsor:before{ 
position:absolute; 
top:-100px; left:-100px; 
width:200px; height:200px; border-radius:100%; content:''; z-index:7;
background-color:rgba(255,255,255,.11);
border:solid 71px rgba(255,255,255,.11);
-webkit-animation-duration:21s; 
-webkit-animation-name:sponsor; 
-webkit-animation-timing-function:ease; 
-webkit-animation-delay:0.3s; 
-webkit-animation-iteration-count:infinite; 
-webkit-animation-direction:normal; 
-webkit-animation-play-state:running;}
@-webkit-keyframes sponsor
{
 0%{ width:200px; height:200px; top:-50%; left:-50%; right:auto; bottom:auto;} 
 25%{width:1991px; height:1991px; top:-100%; left:-100%; right:auto; bottom:auto;}
 26%{width:1991px; height:1991px; top:auto; left:auto; right:-100%; bottom:-100%;}
 50%{width:200px; height:200px; top:auto; left:auto; right:-50%; bottom:-50%;}
 75%{width:1991px; height:1991px; top:auto; left:auto; right:-100%; bottom:-100%;}
 76%{width:1991px; height:1991px; top:-100%; left:-100%; right:auto; bottom:auto;} 
100%{width:200px; height:200px; top:-50%; left:-50%; right:auto; bottom:auto;} 
}
.sponsor:hover:before{-webkit-animation-play-state:paused;}