/* Webfont: Lato-Regular */
@font-face {
    font-family: 'Lato';
    src: url('../fonts/Lato-Regular.eot'); /* IE9 Compat Modes */
    src: url('../fonts/Lato-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/Lato-Regular.woff') format('woff'), /* Modern Browsers */
         url('../fonts/Lato-Regular.ttf') format('truetype'); 
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}
@font-face {
    font-family: 'Latob';
    src: url('../fonts/Lato-Bold.eot'); /* IE9 Compat Modes */
    src: url('../fonts/Lato-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/Lato-Bold.woff') format('woff'), /* Modern Browsers */
         url('../fonts/Lato-Bold.ttf') format('truetype'); 
    font-style: normal;
    font-weight: bold;
    text-rendering: optimizeLegibility;
}
body { 
  font-family: 'Lato', Arial, Helvetica, sans-serif;
  font-size: 14px;
  color: #222222;
  margin: 0px;
  padding-bottom: 0px; 
  background:#ffffff;
}
.fnt {font-family: 'Lato';}
.topnav {margin:10px 5px auto auto;float:right;}

/*.logo {width:144px;height:65px;display: block;background: url('../images/logo.png') no-repeat; background-size: cover;margin-top:15px;margin-bottom: 15px;margin-left:25px;}*/
.logo {width:200px;height:100px;background: url('../images/logo.png') no-repeat; background-size: cover;margin-top:15px;margin-bottom: 15px;margin-left:25px;}
.logo1 {width:200px;height:100px;background: url('../images/logo.png') no-repeat; background-position:center center;background-size:cover;position:relative;left:50%;margin-left:-99px;margin-bottom: 15px;}
.cont {padding-top:125px;padding-bottom:50px;position:relative;z-index: 5;top:-115px;border-bottom-right-radius: 8px;border-bottom-left-radius: 8px;}
.blue-left {padding: 0 20px; border-left: 2px solid rgba(35, 91, 140, 1);min-height:250px;}
.blue-left p {text-align: justify;}
.top {position: relative;z-index:10;margin-top:20px;}
.footer {font-family:'Lato';margin-top:-80px;padding: 15px;position: relative;text-align:right;margin-top:10px;color:rgba(35, 91, 140, 1);}
.footer p {}
.lnav1 a {font-family: 'Latob';font-size:16px;position:relative;top:320px;}
.lnav a {text-align: right;font-family: 'Latob'; display:block;line-height:45px;}
.nav li a {border-bottom: 1px solid transparent;}
.nav li a:hover {background: #2a6496;color:#ffffff;}

/* Special class on .container surrounding .navbar, used for positioning it into place. */
.navbar-wrapper { position: absolute;top: 0; left: 0;right: 0; z-index: 20;}
.navbar-wrapper .container { padding-left: 0; padding-right: 0;}
.navbar-wrapper .navbar { padding-left: 15px; padding-right: 15px;box-shadow:0 0 5px 3px rgba(0,0,0, .50);}
.navbar .nav a {color:#ffffff;}

.menus {position: relative;}

.isi h4{font-size: 28px; line-height: 28px;color:#6BA3D3;margin-bottom: 15px;font-weight:bold;text-transform: uppercase;}
.isi .judulkat {font-size: 24px; line-height: 28px;color:#8BC4F5;margin-bottom: 15px;font-weight:bold;text-transform: uppercase;}
.isi h5{font-size: 20px; line-height: 20px;color:#6BA3D3;margin-bottom: 10px;}
.isi .judul {background:rgba(0,0,0, .75);display: block;padding: 8px; margin-top:-45px;position:relative;}
.isi a:hover {text-decoration: none;}
.isi .img-thumbnail {padding:2px;}
.isi .img {width:100%;}

.isi .prof {font-family: 'Lato';}
.isi .prof .nama {font-size: 20px;margin-top:70px;}
.isi .profil {width:100%;margin-bottom: 10px;display:block;position:relative;}
.isi .profil a {
  -webkit-transform: rotateX(180deg); /* Chrome, Safari, Opera */
  transform: rotateX(180deg);
  text-align: center;
  background:rgba(35, 91, 140, 1);
  width:100%;
  height:100%;
  position:absolute;
  display:block;
  z-index:50;
  opacity:0;
  filter:alpha(opacity=0);
  -o-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -webkit-transition: all 1s ease;
  transition: all 1s ease;
}
.isi .profil a:hover {
  opacity:0.7;
  filter:alpha(opacity=70);
  -webkit-transform: rotateX(0deg); /* Chrome, Safari, Opera */
  transform: rotateX(0deg);
}
.isi .profil h5 {color:#ffffff;font-size:28px;font-family:'Latob';position:absolute;top:45%;z-index:70;width:150px;text-align:center;left:50%;margin-left:-75px;}
.isi .profil h4 {text-align:right;font-family:'Lato';font-size: 20px;position:absolute;right:10px;top:45%;z-index:20;text-transform: capitalize;} 
/*.isi .ts {text-shadow: 2px 2px 2px rgba(0,0,0, .35)}*/
.isi .thumbnail {background:none;border-color:transparent;padding: 0;}
.col {background:#ff9900;}
.spacer {height:10px;width:100%;display:block;}
.bgrnd {
  background:#101010;
  width:100%;
  height:100%;
  display:block;
  position:absolute;
  top:0px;
  bottom:0px;
  left:0px;
  right:0px;
  z-index:-10;
  -webkit-background-size: 100%;
  -moz-background-size: 100%;
  -o-background-size: 100%;
  background-size: 100%;}

.panel-title {font-weight:bold;text-shadow:1px 2px 2px rgba(0,0,0, .5);}
.find {font-size:20px;}
.panel .btn {margin:0;}
.bgrouplist {margin-top:-7px;margin-right:-10px;}
.list-group img {height:35px;width:35px;margin:-8px 10px -8px -10px;}
/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */


/* Pad the edges of the mobile views a bit */
.marketing {padding-left: 15px;padding-right: 15px;}

/* Center align the text within the three columns below the carousel */
.marketing .col-lg-4 {text-align: center; margin-bottom: 20px;}
.marketing h2 { font-weight: normal;}
.marketing .col-lg-4 p { margin-left: 10px; margin-right: 10px;}

/* Featurettes
------------------------- */

.featurette-divider { margin: 80px 0; /* Space out the Bootstrap <hr> more */}

/* Thin out the marketing headings */
.featurette-heading { font-weight: 300; line-height: 1; letter-spacing: -1px;}

/* RESPONSIVE CSS
-------------------------------------------------- */
@media (max-width: 768px) {
.blue-left {padding: 0 20px; border-left: 0;}
.lnav a {list-style: none;text-align: center;}
.lnav1 a {font-family: 'Latob';font-size:16px;position:relative;top:0px;text-align: center;width:100%;display:block;}
.logo {width:200px;height:100px;background: url('../images/logo.png') no-repeat; background-size: cover;margin-top:15px;margin-bottom: 15px;position: relative;left:50%;margin-left:-100px;}
}
@media (min-width: 768px) {
  /* Remove the edge padding needed for mobile */
   .marketing { padding-left: 0; padding-right: 0;}
  .navbar-wrapper { margin-top: 20px;}
  .navbar-wrapper .container { padding-left:  15px; padding-right: 15px;}
  .navbar-wrapper .navbar { padding-left:  0; padding-right: 0; border-radius: 0;}

  /* Bump up size of carousel content */
  .carousel-caption p { margin-bottom: 20px; font-size: 21px; line-height: 1.4;}
  .featurette-heading { font-size: 50px;}
  
}

@media (min-width: 992px) {
  .featurette-heading {margin-top: 120px;}
}

.dropdown-menu {
/*  left:-145px;
  min-width:185px;*/
}
.blue-grad {background:#2fa6c6;}
.bot {position:relative;left:0;right:0;bottom:0;color:}
.bot a {color:#ffffff;font-size: 30px;}
.thumbnails {border-color:transparent;padding: 10px;}
.padd5 {padding:5px;}
.padd10 {padding:10px;}
.table-title {font-size:18px; font-weight:bold;text-align: center;}
.toptit {font-size:20px; font-weight:bold;text-shadow:1px 1px 2px rgba(0,0,0, .5);text-align: center;}