body {
color: #333;
margin: auto;
font-family: 'Montserrat', sans-serif;
background:#e6e6e6;
line-height:1.5;
}
h1, h2, h3, h4, h5, h6 {
margin:0px;
padding:0px;
}
@media only screen and (max-width:429px){
.logo-img {
width:100%;
}
}
@media only screen and (min-width:430px){
.logo-img {
max-width:400px;
}
}
@media only screen and (max-width:279px){
.footer-logo-img {
width:100%;
}
}
@media only screen and (min-width:280px){
.footer-logo-img {
max-width:250px;
}
}
@media only screen and (max-width:429px){
.footer-content {
text-align:justify;
}
}
@media only screen and (min-width:430px){
.footer-logo-img {
text-align:left
}
}
.breadcrumbs {
font-size:15px;
border-bottom:1px solid #199bd6;
padding:7px 10px 13px 10px;
margin:0px 0px 7px 0px;
background:#199bd6;
color:#fff;
}
.breadcrumbs a {
color:#fff !important;
}
.caption a:link {
color:#333;
text-decoration:none;
}
.caption a:hover {
color:#199bd6;
text-decoration:none;
}
a {
color: #333 !important;
text-decoration: none;
}
a:hover {
color: #199bd6 !important;
text-decoration: none;
}
.navbar.navbar-default {
background: #fff;
margin-bottom:0px;
padding: 0px;
}
@media only screen and (min-width:900px){
.headban {
background: #fff;
color: #333;
padding: 20px 0px 30px 0px;
border-bottom:2px solid #199bd6;
max-width:1000px;
margin:auto;
}
#headban.col-sm-5 {
padding:10px;
}
.headban-text1 {
font-size: 40px;
}
.headban-text2 {
font-size: 20px
}
.headban-text3 {
font-size:18px;
}
}
@media only screen and (max-width:900px){
.headban {
background: #fff;
color: #333;
padding: 10px 10px 20px 10px;
border-bottom:2px solid #199bd6;
max-width:1000px;
margin:auto;
}
#headban.col-sm-8 {
text-align:center;
}
#headban.col-sm-4 {
display: none;
}
.headban-text1 {
font-size: 27px;
}
.headban-text2 {
font-size: 14px
}
.headban-text3 {
font-size:14px;
}
}
/* Header */

.navZ {
    font-size: 13px;
font-family: 'Montserrat', sans-serif;
    font-weight:bold;
    color: #199bd6 !important;
    height: 45px;
    background: #fff none repeat scroll 0% 0%;
margin: auto;
z-index: 9999;
max-width: 1000px;
border-bottom: 2px solid #199bd6;
}

.navZ input, .navZ label {
    display: none;
}
.navZ label {
    height: 45px;
    width: 45px;
    color: #AAA;
    line-height: 45px;
    font-size: 25px;
    font-weight: 700;
    text-align: center;
    margin-left: 5px;
    cursor: pointer;
    float: left;
}
.navZ ul {
    margin: 0px;
    padding: 0px;
}
.navZ li {
    list-style: outside none none;
    margin: 0px;
    padding: 0px;
    float: left;
    position: relative;
}
    .navZ input:checked + div label {color: #ffffff;}
    .navZ li a{display: block;
text-decoration: none;
color: #fff;
line-height: 45px;
padding: 0px 15px;
font-size: 13px;
font-family: 'Montserrat', sans-serif;
border-right: 1px solid rgba(0,0,0,0.1);}
    .navZ li a:hover,
    .navZ li:hover a{background: #199bd6;color: #ffffff !important}
    .navZ li.home a{display: block;
background: #fff;color: #333 !important;
text-decoration: none;
line-height: 43px;
padding: 0px 15px;
font-size: 13px;
border-bottom:2px solid #199bd6;
font-family: 'Montserrat', sans-serif;
}
    .navZ li.home a:hover,
    .navZ li.home:hover a{background: #199bd6;color: #ffffff !important}
    .navZ li ul li a:hover,
    .navZ li ul li:hover a{background: rgba(0,0,0,0.1);}
    .navZ li ul {
      transition:  .3s ease-out;-webkit-transition: .3s ease-in-out;-moz-transition: .3s ease-in-out;
      position:absolute;
      top:100%;
      left:0px;
      z-index:99;
      width:200px; 
      opacity: 0;
      height: auto;
      visibility: hidden;
      background: #199bd6;
    }
    .navZ .maxer ul li ul {margin-top: -1px;}
    .navZ li ul li a {text-shadow: none; font-size: 12px;color: #ffffff;line-height: 25px;}
    .navZ li ul li {
      float:none;
      display:block;    
      height: 0;
      transition:  .3s ease-out;-webkit-transition: .3s ease-in-out;-moz-transition: .3s ease-in-out;
      font-weight:normal;
    }
    .navZ li ul ul {
      top:0px;
      left:100%;    
      border-top: 0;
    }
    .navZ li:hover ul { 
      opacity: 1;
      visibility: visible;
    }
    .navZ li:hover ul li { 
      height: 25px;
    }
.serching form {
    max-width: none;
    float: right;
    margin: 4px;
    min-width: 300px;
    background: #FFF none repeat scroll 0% 0%;
    border: 1px solid #199bd6;
    border-radius: 3px;
    position: relative;
    box-shadow: 0px 0px 5px #efefef inset;
}
.serching form input {
    display: block !important;
    margin: 0px;
    border: 0px none;
    padding: 5px 0px;
    outline: 0px none;
    height: 20px;
    line-height: 20px;
    font-size: 14px;
    border-radius: 0px !important;
    position: absolute;
    top: 5px;
    left: 0px;
    bottom: 0px;
    right: 0px;
color:#199bd6
}
.serch {text-indent: 10px;background: transparent;}
.serchg {
    float: right;
    width: 30px;
    height: 30px !important;
    padding: 0px !important;
    background: transparent none repeat scroll 0% 0%;
    color: #199bd6;
    border: 0px none !important;
    font-size: 12px !important;
    cursor: pointer;
}
/* Main Menu */
.ctn {float:none;padding:2px;background: #ffffff}
.sider {float:right;width:30%;margin-top:2px;}
.head, .foot {width:100%;display:block}
#hw {background:#transparent;}
#hw .logo {background-color: #transparent; border-top: 2px solid #199bd6; padding: 8px 12px;color: #303030;}
#hw .logo h1{padding: 2px;font-size:28px;margin:1px;font-weight:bold;}
#hw .logo h1 a:hover {color: #199bd7;text-decoration:none;}
#hw .logo img{width:40%;max-height:50px;}
#hw .desc{margin:0;padding:6px 12px;background:#f3f3f3;border-bottom:solid 1px #ddd;font-size: inherit;}
#hw .desc h2{margin:0;padding:0px;}
#hw .nav {background-color: #ffffff;border-bottom:2px solid #ffffff;text-align:left;padding:6px 0px;display:block;width:100%;}
#hw .nav a{padding:6px 15px;color:#199bd6 !important;font-weight:bold;text-decoration:none;border-right:1px solid rgba(0,0,0,0.1);border-bottom:2px solid #ffffff;width:auto;}
#hw .nav a:hover{border-bottom:2px solid #0087cf;}
#hw .nav span.sptr{display:none;}
#hw .profil{border-bottom:solid 1px #50a7e6;padding:2px 3px;}
#hw .msg{background-color: #fff;border:solid 1px #50a7e6;padding:3px 6px;}
#hw .navbar ,.thmlink{text-align:left;padding:5px 3px;border-bottom:solid 1px #ddd;display:block;}
#hw .navbar a,.thmlink a{background-color: #199bd6;padding:1px 6px;color:#fff !important;text-decoration:none;}
/* Other */
h3.barl {margin:0;padding:3px 6px;background:#f3f3f3;border-bottom:solid 1px #ddd;font-size: inherit;}
h3.barl a{margin:0;padding:2px 4px;font-size: 14px}
h3.barl a:hover{text-decoration:underline;}
.note{background:#fff; padding:3px 6px;}
.search, .ads{background:#fff; padding:3px 8px;}
.search:hover, .ads:hover{border-left:3px solid #50a7e6;}
.breadcrumb, .title {margin:0;padding:6px 12px;background:#f3f3f3;border-bottom:solid 1px #ddd;font-size: inherit;}
.breadcrumb h2, .title h2{margin:0;padding:0px;font-size: 16px;}
.list-a ,.main{background:#fff; padding:5px 10px;border-bottom:solid 1px #eee;line-height:18px;overflow:hidden}
.notif {background:#fff; padding:3px 6px;border:solid 1px #50a7e6;}
.razdl {margin:0;padding:3px 6px;background:#f3f3f3;border-top:solid 1px #50a7e6;font-size: inherit;}
.navp {padding:3px 6px;}
.left {float:left;text-align:left;}
.right {float:right;text-align:right;}


    @media screen and (max-width:902px) {
      .serching form {min-width: 180px;}
            }
            @media screen and (max-width:600px) {
                      .navZ {position: relative;}
                      .navZ label {display: block;}
                      .navZ ul {display: none;position: absolute; top: 100%;left:0;right:0;background: #fff;z-index:1;}
      .navZ .maxer ul li {float: none;border-top: 1px solid #e0e0e0;
border-bottom: 1px solid #199bd6;}
      .navZ .maxer ul li a {line-height: 30px;}
      .navZ .maxer ul li ul {margin-bottom: 10px;}
                      .navZ input:checked + div ul {display: block;}
.navZ li ul li:hover a, .navZ li:hover a {
background: transparent;
      }
      .navZ a:hover {background:#199bd6 !important}
      .navZ li:hover ul {opacity: 1;} 
      .navZ li ul {
        position: static;
        visibility: visible;
        opacity: 1;
        width: auto;
        background: transparent;
      }
      .navZ li ul li a, .navZ li a {color: #fff;}
.navZ li ul li ul {
      }
      .navZ li ul li, .navZ li:hover ul li {
        height: auto;
      }
      .navZ li ul li {
        margin-left: 20px;
        border-left: 3px solid #2A5A86;
      }
.serching form {
min-width: 0;
float: none;
position: absolute;
left: 45px;
        right: 0;}
.serching form input{
width: 90%;}
.serching form button{
width: 10%;}

.ctn {float:none;width:100%;padding-right:0px;}
.sider {float:none;width:100%;padding-left:0px;}
}

.f-nav{ z-index: 9999; position: fixed; center: 0; top: 0; max-width: 780px; width: 100%; padding:0; margin: 0 auto;} /* ini yang membuat menu menjadi melayang (fixed) */
    
            @media screen and (max-width:480px) {

#hw .nav{text-align:center;font-weight:bold}
#hw .nav a{padding:2px;color:#0086ce !important;font-weight:bold;text-decoration:none;border-right:0px solid rgba(0,0,0,0.1);border-bottom:0px solid #ffffff;width:auto;}
#hw .nav a:hover{border-bottom:0px solid #0087cf;text-decoration:underline}
#hw .nav span.sptr{display:inline;font-weight:bold;}
}
#footer {
line-height:1.5;
max-width:1000px;
margin:auto;
}
#footer .copyright {
font-size:12px;
color: #c6c6c6;
}
.hg-btn {
  font-family: Montserrat;
color: #fff !important;
    background: #199bd6;
    padding: 6px 12px;
    font-size: 13px;
    text-shadow: none;
    border: 2px solid #199bd6;
  -webkit-border-radius: 5px;
    border-radius: 5px;
    text-transform: capitalize;
    -webkit-transition: all 200ms ease-in;
    -o-transition: all 200ms ease-in;
    -moz-transition: all 200ms ease-in;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
  box-shadow: none;
    display: inline-block;
    letter-spacing: 1px;
margin: 3px 2px 3px 2px;
}
.hg-btn:hover {
  font-family: Montserrat;
color: #333 !important;
    background: #e6e6e6;
    padding: 6px 12px;
    font-size: 13px;
    text-shadow: none;
    border: 2px solid #e6e6e6;
  -webkit-border-radius: 5px;
    border-radius: 5px;
    text-transform: capitalize;
    -webkit-transition: all 200ms ease-in;
    -o-transition: all 200ms ease-in;
    -moz-transition: all 200ms ease-in;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
  box-shadow: none;
    display: inline-block;
    letter-spacing: 1px;
margin: 3px 2px 3px 2px;
}
.dwnld {
  font-family: Montserrat;
color: #fff !important;
    background: #199bd6;
    padding: 6px 12px;
    font-size: 13px;
    text-shadow: none;
    border: 2px solid #199bd6;
  -webkit-border-radius: 5px;
    border-radius: 5px;
    text-transform: capitalize;
    -webkit-transition: all 200ms ease-in;
    -o-transition: all 200ms ease-in;
    -moz-transition: all 200ms ease-in;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
  box-shadow: none;
    display: inline-block;
    letter-spacing: 1px;
margin: 3px;
}
.dwnld:hover {
  font-family: Montserrat;
color: #333 !important;
    background: #e6e6e6;
    padding: 6px 12px;
    font-size: 13px;
    text-shadow: none;
    border: 2px solid #e6e6e6;
  -webkit-border-radius: 5px;
    border-radius: 5px;
    text-transform: capitalize;
    -webkit-transition: all 200ms ease-in;
    -o-transition: all 200ms ease-in;
    -moz-transition: all 200ms ease-in;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
  box-shadow: none;
    display: inline-block;
    letter-spacing: 1px;
margin: 3px;
}

.paging {
    padding: 10px 0px;
    width:100%;
    margin: 0px auto;
text-align:center;
font-weight:bold;
}
.paging a:link {
background-color: #199bd6;
text-decoration: none;
border: 2px solid #199bd6;
color: #fff !important;
margin: 1px;
padding: 4px 7px;
border-radius:3px;
}
.paging a:hover {
background-color: #e6e6e6;
text-decoration: none;
border: 2px solid #e6e6e6;
color: #333 !important;
margin: 1px;
padding: 4px 7px;
border-radius:3px;
}
@media only screen and (max-width:400px){
.no-margin-xs {
margin: 0px;
padding: 0px;
}
}