<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="css/metro-bootstrap.css" rel="stylesheet">
<link href="css/metro-bootstrap-responsive.css" rel="stylesheet">
<link href="css/iconFont.css" rel="stylesheet">
<link href="css/docs.css" rel="stylesheet">
<!-- Load JavaScript Libraries -->
<script src="js/jquery/jquery.min.js"></script>
<script src="js/jquery/jquery.widget.min.js"></script>
<script src="js/jquery/jquery.mousewheel.js"></script>
<!-- Metro UI CSS JavaScript plugins -->
<script src="js/load-metro.js"></script>
<script src="js/docs.js"></script>
<style>
</style>
<title> TB SILALAHI CENTER</title>
</head>
<body class="metro">
<header class="bg-darkCobalt" data-load="atasan.php"></header>
<br />
<div class="container grid">
<div class="border padding15">
<div class="row">
<div class="span7">
<legend>Galeri Acara TB SILALAHI CENTER</legend>
<div class="carousel" id="imgSlide">
<div class="slide">
<img src="images/acara/acara.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/acara/999.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/acara/acara2.jpg" class="cover1"/>
</div>
<div class="slide">
<img src="images/acara/acara4.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/acara/acarafestival.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/acara/budaya.jpg" class="cover1" />
</div>
</div>
</div>
<div class="span7">
<legend>Galeri Koleksi Museum TB SILALAHI</legend>
<div class="carousel" id="imgSlide1">
<div class="slide">
<img src="images/museumtb/halaman.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumtb/1.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumtb/isimuseum1.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumtb/motor.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumtb/perpus.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumtb/paktb.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumtb/1.jpg" class="cover1" />
</div>
</div>
</div>
</div>
</div>
<div class="border padding15">
<div class="row">
<div class="span7">
<legend>Galeri Pengunjung</legend>
<div class="carousel" id="imgSlide2">
<div class="slide">
<img src="images/pengunjung/1.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/pengunjung/2.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/pengunjung/3.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/pengunjung/4.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/pengunjung/5.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/pengunjung/6.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/pengunjung/7.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/pengunjung/8.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/pengunjung/9.jpg" class="cover1" />
</div>
</div>
</div>
<div class="span7">
<legend>Galeri Museum Batak</legend>
<div class="carousel" id="imgSlide3">
<div class="slide">
<img src="images/museumbatak/1.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/2.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/3.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/4.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/5.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/6.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/7.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/8.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/9.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/10.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/11.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/12.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/13.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/14.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/15.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/16.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/17.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/18.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/19.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/20.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/21.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/22.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/23.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/24.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/25.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/26.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/27.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/28.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/29.jpg" class="cover1" />
</div>
<div class="slide">
<img src="images/museumbatak/30.jpg" class="cover1" />
</div>
</div>
</div>
</div>
</div>
</div>
<footer class="dark" data-load="bawahan.html"></footer>
<script>
$(function(){
$("#imgSlide").carousel({
effect: 'slide',
period: 3000,
markers: {
show: true,
type: 'default',
position: 'bottom-right'
}
});
$("#imgSlide1").carousel({
effect: 'fade',
period: 3000,
markers: {
show: true,
type: 'default',
position: 'bottom-right'
}
});
$("#imgSlide2").carousel({
effect: 'slowdown',
period: 3000,
markers: {
show: true,
type: 'default',
position: 'bottom-right'
}
});
$("#imgSlide3").carousel({
effect: 'switch',
period: 3000,
markers: {
show: true,
type: 'default',
position: 'bottom-right'
}
});
$("#imgSlide4").carousel({
effect: 'switch',
period: 3000,
markers: {
show: true,
type: 'default',
position: 'bottom-right'
}
});
})
</script>
</body>
</html>