Commit 24edfcec by Andry F. Hutapea

sedang di kerjakan

parent f36f9251
<?php
include "config/koneksi.php";
?>
<!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>
<!-- Local JavaScript -->
<script src="js/docs.js"></script>
<style>
</style>
<title>Tentang Kami</title>
</head>
<body class="metro">
<header class="bg-darkCobalt" data-load="atasan.php"></header>
<div class="" data-load="sampul.html"></div>
<br />
<!-- ---------------------------------------- ISI TAB ------------------------------------- -->
<div class="container row">
<div class="grid fluid">
<div class="border padding20">
<?php
if($_GET['post']=='profil'){
$is="Profil NINA Tour and Travel";
}else if($_GET['post']=='syarat'){
$is="Syarat dan Ketentuan";
}else if($_GET['post']=='reservasi'){
$is="Cara melakukan reservasi Tour";
}else if($_GET['post']=='pembayaran'){
$is="Cara Pembayaran";
}
?>
<legend class="text-right"><h2><?php echo $is; ?></h2></legend>
<?php
$comot= mysql_query("SELECT * FROM setup_about where kat_about='$_GET[post]'");
while($ngisi= mysql_fetch_array($comot)){
if ($ngisi['judul_about']!=""){
?>
<div class="span4">
<legend><h3><?php echo $ngisi['judul_about']; ?></h3></legend>
</div>
<?php
}
echo $ngisi['konten_about'];
echo "<br />";
}
?>
</div>
</div>
</div>
<!-- ---------------------------------------- ISI TAB ------------------------------------- -->
<footer class="dark" data-load="bawahan.html"></footer>
</body>
</html>
\ No newline at end of file
<nav class="navigation-bar dark">
<nav class="navigation-bar-content container">
<a href="index.php" class="element"><span class="icon-home"></span> BERANDA &trade;</a>
<span class="element-divider"></span>
<a class="element1 pull-menu" href="#"></a>
<ul class="element-menu">
<li>
<a class="dropdown-toggle" href="#"> Tentang TB SILALAHI </a>
<ul class="dropdown-menu" data-role="dropdown">
<li><a href="#">Galeri</a></li>
<li><a href="#">Sejarah</a></li>
</ul>
</li>
<li>
<a class="dropdown-toggle" href="#"> Sejarah Batak </a>
<ul class="dropdown-menu" data-role="dropdown">
<li><a href="bataktoba.php">Batak Toba</a></li>
<li><a href="batakkaro.php">Batak Karo</a></li>
<li><a href="batakangkola.php">Batak Angkola</a></li>
<li class="divider"></li>
<li><a href="batakpakpak.php">Batak Pakpak</a></li>
<li><a href="batakmandailing.php">Batak Mandailing</a></li>
<li><a href="bataksimalungun.php">Batak Simalungun</a></li>
</ul>
</li>
<a class="element brand" href="booking.php">Pemesanan Tiket</a>
<a class="element brand" href="lokasi.php">Denah</a>
<a class="element brand" href="contact.php">About Us</a>
</ul>
</nav>
</nav>
\ No newline at end of file
<?php
session_start();
include_once('config/koneksi.php');
open_page('booking');
?>
<!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">
<link href="css/animate.css" rel="stylesheet" type="text/css">
<!-- 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>
<!-- Local JavaScript -->
<script src="js/docs.js"></script>
</style>
<body class="metro">
<header class="bg-darkCobalt" data-load="atasan.php"></header>
<div id="wrapshopcart">
<center>
<article>
<div class="row">
<div class="col-sm-4 col-lg-12 col-md-4">
<div class="thumbnail" ><br><br><br>
<p><font size="50px"><center>Suku Batak Angkola </font></p> <br><br><img src="image/pakaianangkola.jpg"></center>
<div class="caption">
<h4 class="pull-right"></h4>
<h4>
<center><p align="justify">Suku Angkola atau Batak Angkola, adalah suatu suku yang berdiam tersebar di seluruh wilayah kabupaten Tapanuli Selatan, terutama di daerah Angkola termasuk Padang Sidimpuan di provinsi Sumatra Utara.
Orang Angkola merupakan suatu kelompok masyarakat dari etnis Batak, yang menurut cerita menduduki wilayah Angkola sejak berabad-abad yang lalu.
Nama "angkola" diyakini berasal dari nama sebuah sungai "Batang Angkola" yang berada di daerah Angkola. Dari cerita rakyat Angkola, bahwa sungai ini diberi nama oleh Rajendra Kola (Chola) I, penguasa kerajaan Chola (1014 - 1044 M) yang berasal dari India Selatan, yang memasuki Angkola melalui daerah Padang Lawas.
Daerah Angkola terdiri dari 2 wilayah, yaitu sebelah selatan Batang Angkola diberi nama Angkola Jae (Hilir) dan sebelah Utara diberi nama Angkola Julu (Hulu). Sepeninggal kekuasaan Radjendra Chola I, muncul seorang tokoh dari Tano Angkola, yang bernama Oppu Jolak Maribu yang bermarga Dalimunthe. Oppu Jolak Maribu ini mendirikan huta (kampung) pertama di daerah Angkola yang bernama Sitamiang. Berikutnya seperti Pargarutan yang artinya "tempat mengasah pedang". Tempat ini merupakan tempatnya menanggalkan hari, kalender batak dan lain-lain.</p></center>
<br><a href="">untuk barang2 peninggalan</a></h4>
</div>
<div class="table">
<div class="isi">
<div class="isi_teks">
<div class="definisi_pembungkus">
<center><h2 style="font-family:High Tower Text;margin-top:15px">Tentang Suku Batak Angkola</h2></center>
<div class="isi_definisi" style="float:left;">
<h2 style="font-family:High Tower Text;margin-top:15px">Kuliner</h2>
<div class="gambar_kepala">
<p><b>Holat</b></p><br>
<img style="margin-left:245px" src="image/makananangkola.jpg"></img>
<p>Daerah Tapanuli Selatan ada makanan khas daerah yang cukup lezat untuk di nikmati. Jenis kuliner turun temurun yang menjadi warisan sejak dulu oleh suku Mandailing yaitu Holat. Menikmati Holat ini dapat dijumpai tentunya di daerah Tapanuli Selatan yakni di rumah makan khusus menyediakan makanan khas ini.
Kuliner tradisional khas ini terdiri dari ikan mas bakar yang diberi kuah dari serutan kulit kayu Balaka (Balakat) dan pucuk rotan (Pakat) ditaburi bawang goreng.
Holat ini biasanya di sajikan bersama secambung nasi putih yang panas, Semangkok Holat dihidangkan bersama sambal cabe hijau yang digiling halus dengan sepotong jeruk nipis, kecap manis dan asin (tergantung selera) serta lalapan berupa petai atau jengkol mentah
</p></div>
</div>
<div class="isi_definisi" style="bottom:72px;float:right;">
<h2 style="font-family:High Tower Text;margin-top:15px">Tradisi</h2>
<div class="gambar_kepala">
<p><b>upacara pernikahan</b></p><br>
<p font-color="blue">Acara adat dalam etnis Batak Angkola–Mandailing terdiri atas siluluton (duka cita) dan siriaon (suka cita).
Upacara perkawinan adalah horja (pesta) adat suka cita.
Pada garis besarnya, perkawinan menurut masyarakat Angkola-Mandailing dapat dilakukan dengan dua cara, yakni:
Kedua cara ini masing-masing ada aturannya, tata cara, dan tata tertib yang harus selalu dipatuhi oleh setiap orang Angkola-Mandailing.
Prosesi upacara perkawinan Angkola-Mandailing dimulai dari musyawarah adat makkobar/makkatai, yakni berbicara dalam tutur sapa
yang sangat khusus dan unik, antara barisan yang terdapat dalam
dalian na tolu.
</p><img style="margin-left:245px" src="image/tradisiangkola.jpg"></img>
</div>
</div>
<div class="isi_definisi2" style="float:left;top:12px;">
<h2 style="font-family:High Tower Text;margin-top:15px">Busana</h2>
<br>
<div class="gambar_kepala">
<p><b>Pakaian Adat Angkola</b></p><br>
<p>Suku Batak Angkola adalah salah satu etnik di Tapanuli Selatan, Sumatera Utara yang berada di dalam Wilayah Batak Nama Angkola berasal dari nama sungai, yakni batang Angkola (batang : sungai) yag diberi nama seorang penguasa yang bernama Rajendra Kola (angkola /yang dipertuan kola), melalui Padang Lawas, dan kemudian berkuasa di saat itu. Di sebelah selatan batang angkola diberi nama Angkola Jae (hilir) dan di sebelah utara sungai batang angkola diberi nama Angkola julu (hulu).
Suku Batak Angkola sendiri mengenal paham kekerabatan patrilineal. Dalam sistem patrilineal, orang Angkola mengenal marga. Di Angkola hanya dikenal beberapa marga saja, antara lain Siregar, Harahap, Hasibuan, Rambe, Daulay, Tanjung, Ritonga, dan Hutasuhut. Orang Batak Angkola mengenal pelarangan kawin semarga.
</p><img style="margin-left:245px" src="image/pakaianangkola.jpg">
</div>
</div>
<div class="isi_definisi2" style="bottom:60px;float:right;">
<h2 style="font-family:High Tower Text;margin-top:15px">Rumah Adat</h2><br>
<div class="gambar_kepala">
<p><b>Rumah adat</b></p><br>
<p>Seperti etnis Batak pada umumnya, tradisi marga juga berkembang dalam masyarakat suku Batak Angkola. Marga-marga yang terdapat pada masyarakat Angkola adalah Dalimunthe, Harahap, Siregar, Nasution, Ritonga, Batubara, Daulay dan lainnya.
Beberapa marga pada masyarakat Angkola terlihat masih memiliki kekerabatan dengan marga-marga yang ada suku Batak Toba dan Batak Mandailing. Secara sejarah suku Angkola ini masih berkerabat dengan suku Batak Toba dan Batak Mandailing. Saat ini suku Batak Angkola berkembang dan diakui sebagai suku tersendiri, karena mereka memiliki tradisi budaya dan bahasa sendiri.
</p><br><img style="margin-left:245px" src="image/rumahangkola.jpg"></img>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</article>
</center>
</div>
<footer class="dark" data-load="bawahan.html"></footer>
</body>
</html>
<?php
session_start();
include_once('config/koneksi.php');
open_page('booking');
?>
<!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">
<link href="css/animate.css" rel="stylesheet" type="text/css">
<!-- 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>
<!-- Local JavaScript -->
<script src="js/docs.js"></script>
</style>
<body class="metro">
<header class="bg-darkCobalt" data-load="atasan.php"></header>
<div id="wrapshopcart">
<article>
<div class="row">
<div class="col-sm-4 col-lg-12 col-md-4">
<div class="thumbnail" ><br><br><br>
<p><font size="50px"><center>Suku Karo</font></p> <br><br><img src="image/pakaiankaro.jpg"></center>
<div class="caption">
<h4 class="pull-right"></h4>
<h4>
<center><p align="justify">Suku Karo adalah suku bangsa yang mendiami wilayah Sumatera Utara dan sebagian Aceh; meliputi Kabupaten Karo, Kabupaten Aceh Timur, Kabupaten Langkat, Kabupaten Dairi, Kabupaten Simalungun, dan Kabupaten Deli Serdang
Suku ini merupakan salah satu suku terbesar dalam Sumatera Utara. Nama suku ini dijadikan salah satu nama Kabupaten di salah satu wilayah yang mereka diami (dataran tinggi Karo) yaitu Tanah Karo yang terletak di kabupaten karo. Suku ini memiliki bahasa sendiri yang disebut Bahasa Karo atau Cakap Karo.
Pakaian adat suku Karo didominasi dengan warna merah serta hitam dan penuh dengan perhiasan emas.</p></center>
<br><a href="">untuk barang2 peninggalan</a></h4>
</div>
<div class="table">
<div class="isi">
<div class="isi_teks">
<div class="definisi_pembungkus">
<center><h2 style="font-family:High Tower Text;margin-top:15px">Tentang Suku Batak Karo</h2></center>
<div class="isi_definisi" style="float:left;">
<h2 style="font-family:High Tower Text;margin-top:15px">Kuliner</h2>
<div class="gambar_kepala">
<p><b>Babi panggang karo</b></p><br>
<img style="margin-left:245px" src="image/bpk.jpg"></img>
<p>Makanan ini cukup mudah kita jumpai, resep yang akan kita bahas kali ini adalah Resep Masakan Babi Panggang Karo (BPK). Pepaduan babi panggang kering yang dipadukan dengan bumbu darah menjadikan makanan ini menjadi lebih nikmat dan lezat. Proses pembuatannya ada dibagi menjadi dua tahap. Tahap pembuatan Babi Panggang dan Pembutan bumbunya.</p>
</div>
</div>
<div class="isi_definisi" style="bottom:72px;float:right;">
<h2 style="font-family:High Tower Text;margin-top:15px">Tradisi</h2>
<div class="gambar_kepala">
<p><b>upacara pernikahan</b></p><br>
<p font-color="blue">Wedding atau perkawinan dalam Bhs.Batak Karo (BK) adalah erjabu atau dikenal dengan istilah perjabun. Proses perjabun dalam adat BK memiliki 5 tahapan yakni: 1)Ngembah Belo Selambar, 2)Nganting Manuk, 3)Pasu-pasu (option),4)Kerja Adat (Erdemubayu-Ngeranaken-kerja-kerja, dan 5)Mukul. Kelima tahapan tersebut harus dilakukan bila kita ingin perkawinan diakui berdasarkan adat-istiadat BK. Proses perjabun BK dianggap sah bila dihadiri/disetujui oleh “Sanggep Nggeluh”/Daliken Sitelu yang dikenal dengan istilah:1)kalimbubu (kelompok paman,2)Senina (saudara kandun/sedarah), dan 3)anakberu (kelompok perempuan).
<img style="margin-left:245px" src="image/tradisikaro.jpg"></img>
</div>
</div>
<div class="isi_definisi2" style="float:left;top:12px;">
<h2 style="font-family:High Tower Text;margin-top:15px">Busana</h2>
<br>
<div class="gambar_kepala">
<p><b>Uis Gara</b></p><br>
<p>Uis Gara atau Uis Adat Karo adalah pakaian adat yang digunakan dalam kegiatan adat dan budaya Suku Karo dari Sumatera Utara. Selain digunakan sebagai pakaian resmi dalam kegiatan adat dan budaya, pakaian ini sebelumnya digunakan pula dalam kehidupan sehari-hari masyarakat tradisional Karo.
Kata Uis Gara sendiri berasal dari Bahasa Karo, yaitu Uis yang berarti kain dan Gara yang berarti merah. Disebut sebagai "kain merah" karena pada uis gara warna yang dominan adalah merah, hitam, dan putih, serta dihiasi pula berbagai ragam tenunan dari benang emas dan perak.
<img style="margin-left:245px" src="image/pakaiankaro.jpg">
</div>
</div>
<div class="isi_definisi2" style="bottom:60px;float:right;">
<h2 style="font-family:High Tower Text;margin-top:15px">Rumah Adat</h2><br>
<div class="gambar_kepala">
<p><b>Rumah adat</b></p><br>
<p>Rumah adat karo, seperti juga rumah adat Toba, Mandailing, Simalungun, Dairi dan Pakpak, tidak memiliki kamar-kamar. Rata-rata rumah adat dari klan Batak ini, dapur tempat memasak berada di tengah rumah. Semua rumah-rumah adat ini adalah rumah panggung dengan falsafah masing-masing pula.
Rumah adat Karo yang berada di daerah pegunungan dengan udara yang dingin, dapur di tengah rumah memiliki fungsi dan makna tersendiri. Selain menerangi bagian rumah, juga memberikan kehangatan bagi seluruh keluarga.</p>
<br><img style="margin-left:245px" src="image/rumahkaro.jpg"></img>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</article>
</div>
<footer class="dark" data-load="bawahan.html"></footer>
</body>
</html>
<?php
session_start();
include_once('config/koneksi.php');
open_page('booking');
?>
<!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">
<link href="css/animate.css" rel="stylesheet" type="text/css">
<!-- 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>
<!-- Local JavaScript -->
<script src="js/docs.js"></script>
</style>
<body class="metro">
<header class="bg-darkCobalt" data-load="atasan.php"></header>
<div id="wrapshopcart">
<article>
<div class="row">
<div class="col-sm-4 col-lg-12 col-md-4">
<div class="thumbnail" ><br><br><br>
<p><font size="50px"><center>Suku Batak Mandailing</font></p> <br><br><img src="image/pakaianmandailing.jpg"></center>
<div class="caption">
<h4 class="pull-right"></h4>
<h4>
<center><p align="justify">Suku Batak Mandailing, Suku Batak Mandailing adalah salah satu suku yang ada di Asia Tenggara. Suku ini lebih banyak ditemui di bagian utara pulau Sumatera, Indonesia. Mereka datang di bawah pengaruh Kaum Padri yang memerintah Minangkabau di Tanah Datar. Hasilnya, suku ini dipengaruhi oleh budaya Islam. Suku ini juga tersebar di Malaysia, tepatnya di Selangor dan Perak. Suku ini juga memiliki keterkaitan dengan Suku Angkola.
</p></center>
<br><a href="">untuk barang2 peninggalan</a></h4>
</div>
<div class="table">
<div class="isi">
<div class="isi_teks">
<div class="definisi_pembungkus">
<center><h2 style="font-family:High Tower Text;margin-top:15px">Tentang Suku Batak Mandailing</h2></center>
<div class="isi_definisi" style="float:left;">
<h2 style="font-family:High Tower Text;margin-top:15px">Kuliner</h2>
<div class="gambar_kepala">
<p><b>Gule bulung gadong</b></p><br>
<img style="margin-left:245px" src="image/gule.jpg"></img>
<p>Masakan ini salah satu masakan paling enak yang sangat di sukai orang Mandailing.ini terbuat dair daun singkong muda di tumbuk ditambah lasiak lamot (cabe rawit) serta di tambah arias,rimbang (tekokak) yang di masak bersama dengan santan kelapa.supaya masakan ini tambah enak bisa di tambahkan dengan Gulaen Sale (ikan asap) bisa juga di tambah Parira (Petai) atau Joring (jengkol).
</p></div>
</div>
<div class="isi_definisi" style="bottom:72px;float:right;">
<h2 style="font-family:High Tower Text;margin-top:15px">Tradisi</h2>
<div class="gambar_kepala">
<p><b>upacara pernikahan</b></p><br>
<p font-color="blue">Adat pada suku Mandailing melibatkan banyak orang dari dalian na tolu, seperti mora, kahanggi dan anak boru. Prosesi upacara pernikahan dimulai dari musyawarah adat yang disebut makkobar/makkatai, yaitu berbicara dalam tutur sapa yang sangat khusus dan unik. Setiap anggota berbalas tutur, seperti berbalas pantun secara bergiliran. Orang pertama yang membuka pembicaraan adalah juru bicara yang punya hajat (suhut), dilanjutkan dengan menantu yang punya hajat (anak boru suhut), ipar dari anak boru (pisang raut), peserta musyawarah yang turut hadir (paralok-alok), raja adat di kampung tersebut (hatobangan), raja adat dari kambpung sebelah (raja torbing balok) dan raja diraja adat/pimpinan sidang (raja panusunan bulang).
</p><img style="margin-left:245px" src="image/tradisimandailing.jpg"></img>
</div>
</div>
<div class="isi_definisi2" style="float:left;top:12px;">
<h2 style="font-family:High Tower Text;margin-top:15px">Busana</h2>
<br>
<div class="gambar_kepala">
<p><b>Pakaian Adat</b></p><br>
<p>Suku Batak Mandailing, Suku Batak Mandailing adalah salah satu suku yang ada di Asia Tenggara. Suku ini lebih banyak ditemui di bagian utara pulau Sumatera, Indonesia. Mereka datang di bawah pengaruh Kaum Padri yang memerintah Minangkabau di Tanah Datar. Hasilnya, suku ini dipengaruhi oleh budaya Islam. Suku ini juga tersebar di Malaysia, tepatnya di Selangor dan Perak. Suku ini juga memiliki keterkaitan dengan Suku Angkola.
</p><img style="margin-left:245px" src="image/pakaianmandailing.jpg">
</div>
</div>
<div class="isi_definisi2" style="bottom:60px;float:right;">
<h2 style="font-family:High Tower Text;margin-top:15px">Rumah Adat</h2><br>
<div class="gambar_kepala">
<p><b>Rumah adat</b></p><br>
<p>Bagas Godang merupakan rumah berarsitektur Mandailing dengan konstruksi yang khas. Berbentuk empat persegi panjang yang disangga kayu-kayu besar berjumlah ganjil. Ruang terdiri dari ruang depan, ruang tengah, ruang tidur, dan dapur. Terbuat dari kayu, berkolong dengan tujuh atau sembilan anak tangga, berpintu lebar dan berbunyi keras jika dibuka. Kontruksi atap berbentuk tarup silengkung dolok, seperti atap pedati. Satu komplek dengan Bagas Godang terdapat Sopo Godang, Sopo Gondang, Sopo Jago, dan Sopo Eme. Keseluruhan menghadap ke Alaman Bolak.
</p><br><img style="margin-left:245px" src="image/rumahmandailing.jpg"></img>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</article>
</div>
<footer class="dark" data-load="bawahan.html"></footer>
</body>
</html>
<?php
session_start();
include_once('config/koneksi.php');
open_page('booking');
?>
<!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">
<link href="css/animate.css" rel="stylesheet" type="text/css">
<!-- 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>
<!-- Local JavaScript -->
<script src="js/docs.js"></script>
</style>
<body class="metro">
<header class="bg-darkCobalt" data-load="atasan.php"></header>
<div id="wrapshopcart">
<article>
<div class="row">
<div class="col-sm-4 col-lg-12 col-md-4">
<div class="thumbnail" ><br><br><br>
<p><font size="50px"><center>Suku Batak Pakpak</font></p> <br><br><img src="image/pakaianpakpak.jpg"></center>
<div class="caption">
<h4 class="pull-right"></h4>
<h4>
<center><p align="justify">Suku Batak Pakpak adalah salah satu suku bangsa yang terdapat di Pulau Sumatera Indonesia. Tersebar di beberapa kabupaten/kota di Sumatera Utara dan Aceh, yakni di Kabupaten Dairi, Kabupaten Pakpak Bharat, Kabupaten Humbang Hasundutan, Tapanuli Tengah (Sumatera Utara), Kabupaten Aceh Singkil dan Kota Subulussalam (Provinsi Aceh)
Dalam administrasi pemerintahan, suku Pakpak banyak bermukim di wilayah Kabupaten Dairi di Sumatera Utara.</p>
<br><a href="">untuk barang2 peninggalan</a></h4>
</div>
<div class="table">
<div class="isi">
<div class="isi_teks">
<div class="definisi_pembungkus">
<center><h2 style="font-family:High Tower Text;margin-top:15px">Tentang Suku Batak Pakpak</h2></center>
<div class="isi_definisi" style="float:left;">
<h2 style="font-family:High Tower Text;margin-top:15px">Kuliner</h2>
<div class="gambar_kepala">
<p><b>Pelleng (Nasi Kuning)</b></p><br>
<img style="margin-left:245px" src="image/peleng.jpg"></img>
<p>Ini makanan khas, yang oleh orang Pakpak dipercaya memiliki kekuatan supranatural. Santapan ini lazimnya dihidangkan dalam acara menyongsong kegiatan yang dianggap berisiko besar. Perang misalnya. Juga dalam perhelatan untuk menggapai cita-cita atau mewujudkan harapan. Misalnya upacara menanda tahun, merkottas, meneppuh babah, atau mbengket bages.
</p></div>
</div>
<div class="isi_definisi" style="bottom:72px;float:right;">
<h2 style="font-family:High Tower Text;margin-top:15px">Tradisi</h2>
<div class="gambar_kepala">
<p><b>“Tatak”</b></p><br>
<p font-color="blue">“Tatak”, atau tarian sebagaimana didaerah lain di Indonesia sebagai kekayaan khasanah budaya bangsa juga terdapat di daerah Pakpak. Pada masyarakat Pakpak “tatak” atau tarian merupakan unsur kesenian penting yang hadir dalam aktivitas keseharian masyarakatnya. Berbagai kegiatan kemasyarakatan baik dalam acara-acara adat apalagi acara-acara ritual sebelum kehadiran Agama “tatak” akan selalu tampak. Oleh karenanya, dia merupakan bagian dari perlaku masyarakatnya yang selalu terimplementasi dalam kehidupan keseharian. Kini meski dengan pemaknaan yang mungkin berbeda, upacara ritual tetap dilakukan sebagai cerminan berbagai simbol kebudayaan. Upacara yang masih dilakukan misalnya menanda tahun, ketika musim tanam hendak dimulai. Dengan demikian tentu pula, tatak masih tetap ada dan eksist.
</p><img style="margin-left:245px" src="image/taktak.jpg"></img>
</div>
</div>
<div class="isi_definisi2" style="float:left;top:12px;">
<h2 style="font-family:High Tower Text;margin-top:15px">Busana</h2>
<br>
<div class="gambar_kepala">
<p><b>pakaian Adat Pakpak</b></p><br>
<p>Suku Batak Pakpak adalah salah satu suku bangsa yang terdapat di Pulau Sumatera Indonesia. Tersebar di beberapa kabupaten/kota di Sumatera Utara dan Aceh, yakni di Kabupaten Dairi, Kabupaten Pakpak Bharat, Kabupaten Humbang Hasundutan, Tapanuli Tengah (Sumatera Utara), Kabupaten Aceh Singkil dan Kota Subulussalam (Provinsi Aceh)
Dalam administrasi pemerintahan, suku Pakpak banyak bermukim di wilayah Kabupaten Dairi di Sumatera Utara.</p>
<img style="margin-left:245px" src="image/pakaianpakpak.jpg">
</div>
</div>
<div class="isi_definisi2" style="bottom:60px;float:right;">
<h2 style="font-family:High Tower Text;margin-top:15px">Rumah Adat</h2><br>
<div class="gambar_kepala">
<p><b>Rumah adat</b></p><br>
<p>Rumah adat Pakpak memiliki bentuk yang khas yang dibuat dari bahan kayu dengan atap dari bahan ijuk. Bentuk desain Rumah Adat Pakpak Sumatera Utara selain sebagai wujud seni budaya Pakpak, setiap bentuk desain dari bagian-bagian Rumah Adat Pakpak tersebut memiliki arti tersendiri. Jika diteliti dengan cermat dan diketahui maknanya, maka cukup dengan melihat rumah adat Pakpak akan bisa mendeskripsikan bagaimana Suku Pakpak berbudaya.
</p><br><img style="margin-left:245px" src="image/rumahpakpak.jpg"></img>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</article>
</div>
<footer class="dark" data-load="bawahan.html"></footer>
</body>
</html>
<?php
session_start();
include_once('config/koneksi.php');
open_page('booking');
?>
<!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">
<link href="css/animate.css" rel="stylesheet" type="text/css">
<!-- 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>
<!-- Local JavaScript -->
<script src="js/docs.js"></script>
</style>
<body class="metro">
<header class="bg-darkCobalt" data-load="atasan.php"></header>
<div id="wrapshopcart">
<article>
<div class="row">
<div class="col-sm-4 col-lg-12 col-md-4">
<div class="thumbnail" ><br><br><br>
<p><font size="50px"><center>Suku Batak Simalungun</font></p> <br><br><img src="image/pakaiansimalungun.jpg"></center>
<div class="caption">
<h4 class="pull-right"></h4>
<h4>
<center><p align="justify">suku Batak Simalungun adalah salah sub Suku Bangsa Batak yang berada di provinsi Sumatera Utara, Indonesia, yang menetap di Kabupaten Simalungun dan sekitarnya. Beberapa sumber menyatakan bahwa leluhur suku ini berasal dari daerah India Selatan tapi ini hal yang sedang diperdebatkan.
Sepanjang sejarah suku ini terbagi ke dalam beberapa kerajaan. Marga asli penduduk Simalungun adalah Damanik, dan 3 marga pendatang yaitu, Saragih, Sinaga, dan Purba. Kemudian marga marga (nama keluarga) tersebut menjadi 4 marga besar di Simalungun.
Orang Batak menyebut suku ini sebagai suku "Si Balungu" dari legenda hantu yang menimbulkan wabah penyakit di daerah tersebut, sedangkan orang Karo menyebutnya Timur karena bertempat di sebelah timur mereka..</p></center>
<br><a href="">untuk barang2 peninggalan</a></h4>
</div>
<div class="table">
<div class="isi">
<div class="isi_teks">
<div class="definisi_pembungkus">
<center><h2 style="font-family:High Tower Text;margin-top:15px">Tentang Suku Batak Simalungun</h2></center>
<div class="isi_definisi" style="float:left;">
<h2 style="font-family:High Tower Text;margin-top:15px">Kuliner</h2>
<div class="gambar_kepala">
<p><b>Babi panggang karo</b></p><br>
<img style="margin-left:245px" src="image/bpk.jpg"></img>
<p>Makanan ini cukup mudah kita jumpai, resep yang akan kita bahas kali ini adalah Resep Masakan Babi Panggang Karo (BPK). Pepaduan babi panggang kering yang dipadukan dengan bumbu darah menjadikan makanan ini menjadi lebih nikmat dan lezat. Proses pembuatannya ada dibagi menjadi dua tahap. Tahap pembuatan Babi Panggang dan Pembutan bumbunya.</p>
</div>
</div>
<div class="isi_definisi" style="bottom:72px;float:right;">
<h2 style="font-family:High Tower Text;margin-top:15px">Tradisi</h2>
<div class="gambar_kepala">
<p><b>upacara pernikahan</b></p><br>
<p font-color="blue">Wedding atau perkawinan dalam Bhs.Batak Karo (BK) adalah erjabu atau dikenal dengan istilah perjabun. Proses perjabun dalam adat BK memiliki 5 tahapan yakni: 1)Ngembah Belo Selambar, 2)Nganting Manuk, 3)Pasu-pasu (option),4)Kerja Adat (Erdemubayu-Ngeranaken-kerja-kerja, dan 5)Mukul. Kelima tahapan tersebut harus dilakukan bila kita ingin perkawinan diakui berdasarkan adat-istiadat BK. Proses perjabun BK dianggap sah bila dihadiri/disetujui oleh “Sanggep Nggeluh”/Daliken Sitelu yang dikenal dengan istilah:1)kalimbubu (kelompok paman,2)Senina (saudara kandun/sedarah), dan 3)anakberu (kelompok perempuan).
<img style="margin-left:245px" src="image/tradisikaro.jpg"></img>
</div>
</div>
<div class="isi_definisi2" style="float:left;top:12px;">
<h2 style="font-family:High Tower Text;margin-top:15px">Busana</h2>
<br>
<div class="gambar_kepala">
<p><b>Pakaian Adat simalungun</p><br>
<p>suku Batak Simalungun adalah salah sub Suku Bangsa Batak yang berada di provinsi Sumatera Utara, Indonesia, yang menetap di Kabupaten Simalungun dan sekitarnya. Beberapa sumber menyatakan bahwa leluhur suku ini berasal dari daerah India Selatan tapi ini hal yang sedang diperdebatkan.
Sepanjang sejarah suku ini terbagi ke dalam beberapa kerajaan. Marga asli penduduk Simalungun adalah Damanik, dan 3 marga pendatang yaitu, Saragih, Sinaga, dan Purba. Kemudian marga marga (nama keluarga) tersebut menjadi 4 marga besar di Simalungun.
Orang Batak menyebut suku ini sebagai suku "Si Balungu" dari legenda hantu yang menimbulkan wabah penyakit di daerah tersebut, sedangkan orang Karo menyebutnya Timur karena bertempat di sebelah timur mereka.
</p><img style="margin-left:245px" src="image/pakaiansimalungun.jpg">
</div>
</div>
<div class="isi_definisi2" style="bottom:60px;float:right;">
<h2 style="font-family:High Tower Text;margin-top:15px">Rumah Adat</h2><br>
<div class="gambar_kepala">
<p><b>Rumah adat</b></p><br>
<p>Rumah adat karo, seperti juga rumah adat Toba, Mandailing, Simalungun, Dairi dan Pakpak, tidak memiliki kamar-kamar. Rata-rata rumah adat dari klan Batak ini, dapur tempat memasak berada di tengah rumah. Semua rumah-rumah adat ini adalah rumah panggung dengan falsafah masing-masing pula.
Rumah adat Karo yang berada di daerah pegunungan dengan udara yang dingin, dapur di tengah rumah memiliki fungsi dan makna tersendiri. Selain menerangi bagian rumah, juga memberikan kehangatan bagi seluruh keluarga.</p>
<br><img style="margin-left:245px" src="image/rumahkaro.jpg"></img>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</article>
</div>
<footer class="dark" data-load="bawahan.html"></footer>
</body>
</html>
<?php
session_start();
include_once('config/koneksi.php');
open_page('booking');
?>
<!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">
<link href="css/animate.css" rel="stylesheet" type="text/css">
<!-- 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>
<!-- Local JavaScript -->
<script src="js/docs.js"></script>
</style>
<body class="metro">
<header class="bg-darkCobalt" data-load="atasan.php"></header>
<div id="wrapshopcart">
<article>
<div class="row">
<div class="col-sm-4 col-lg-12 col-md-4">
<div class="thumbnail" ><br><br><br>
<p><font size="50px"><center>Suku Batak Toba</font></p> <br><br><img src="image/pakaiantoba.jpg"></center>
<div class="caption">
<h4 class="pull-right"></h4>
<h4>
<center><p align="justify">Batak Toba adalah suatu kesatuan kultural. Batak Toba tidak mesti tinggal diwilayah geografis Toba, meski asal-muasal adalah Toba. Sebagaimana suku-suku bangsa lain, suku bangsa Batak Tobapun bermigrasi kedaerah-daerah yang lebih menjanjikan penghidupan yang labih baik. Contoh, mayoritas penduduk asli Silindung adalah marga-marga Hutabarat, Panggabean, Simorangkir, Hutagalung, Hutapea dan Lumbantobing.
Padahal ke-enam marga tersebut adalah turunan Guru Mangaloksa yang adalah salah- seorang anak Raja Hasibuan diwilayah Toba. Demikian pula marga Nasution yang kebanyakan tinggal wilayah Padangsidimpuan adalah saudara marga Siahaan di Balige, tentu kedua marga ini adalah turunan leluhur yang sama..</p></center>
<br><a href="">untuk barang2 peninggalan</a></h4>
</div>
<div class="isi">
<div class="isi_teks">
<div class="definisi_pembungkus">
<center><h2 style="font-family:High Tower Text;margin-top:15px">Tentang Suku Batak Toba</h2></center>
<div class="isi_definisi" style="float:left;">
<h2 style="font-family:High Tower Text;margin-top:15px">Kuliner</h2>
<div class="gambar_kepala">
<p><b>Naniura</b></p><br>
<img style="margin-left:245px" src="image/Naniura.jpg"></img>
<p>makanan khas batak yang ini cukup berbeda dari yang lainnya, yakni bernama naniura. Naniura bisa dikatakan sebagai sushinya orang batak, wah cukup moderen ya guys. Makanan khas batak ini juga memiliki cita rasa yang tak kalah enaknya dengan sushi yang sebenarnya.Biasanya naniura sedikit lebih asam karena memang untuk proses pematangannya menggunakan asam.
Bedanya Naniura tidak dimasak, digoreng ataupun direbus. Makanan khas batak ini berbahan dasar ikan mas, ikan nila atau pun ikan mujahir. Disajikan dengan bumbu yang lengkap sehingga membuat ikan tersebut lebih enak dirasa tanpa dimasak. Dengan kata lain bahwa bumbu-bumbu itulah yang memasak ikan tersebut.</p>
</div>
</div>
<div class="isi_definisi" style="bottom:72px;float:right;">
<h2 style="font-family:High Tower Text;margin-top:15px">Tradisi</h2>
<div class="gambar_kepala">
<p><b>Tortor</b></p><br>
<p font-color="blue">Suku Batak Toba memiliki tari tradisional yang unik berupa tari tor-tor. Melalui laman nationalgeographic.co.id seorang tokoh seni (pendiri sanggar seni tor-tor) Togarma Naibaho menjelaskan, kata "Tor-tor" berasal dari suara entakan kaki penarinya di atas papan rumah adat Batak. Penari bergerak dengan iringan Gondang yang juga berirama mengentak. Adapun tujuan tarian tor-tor ini dulu untuk upacara kematian, panen, penyembuhan, dan pesta muda-mudi. Dan tarian ini memiliki proses ritual yang harus dilalui</p>
<img style="margin-left:245px" src="image/taradisitoba.jpg"></img>
</div>
</div>
<div class="isi_definisi2" style="float:left;top:12px;">
<h2 style="font-family:High Tower Text;margin-top:15px">Busana</h2>
<br>
<div class="gambar_kepala">
<p><b>Pakaian Batak Toba</b></p><br>
<p>Pakaian Adat Batak Toba adalah busana tradisional dari Suku Batak etnis Toba. Etnis Toba lebih kerap menggunakannya di saat acara-acara besar terutama pada pernikahan adat. Kain yang digunakan di dominasi Ulos, tenun tradisional Batak yang kini dapat anda temukan dengan mudah. Selain itu berbagai jenis asesoris penghias tubuh juga menjadi pelengkap. Seiring dengan perkembangan zaman, Pakaian adat Batak Toba modern sudah menjadi bagian tak terpisahkan dari industri fashion tanah air dan bahkan dunia.
</p><img style="margin-left:245px" src="image/pakaiantoba.jpg">
</div>
</div>
<div class="isi_definisi2" style="bottom:60px;float:right;">
<h2 style="font-family:High Tower Text;margin-top:15px">Rumah Adat</h2><br>
<div class="gambar_kepala">
<p><b>Rumah Bolon</b></p><br>
<p> Rumah Balai Batak Toba adalah rumah adat dari daerah Sumatera Utara. Rumah ini terbagi atas dua bagian yaitu jabu parsakitan dan jabu bolon. Jabu parsakitan adalah tempat penyimpanan barang. Tempat ini juga terkadang dipakai sebagai tempat untuk pembicaraan terkait dengan hal-hal adat. Jabu bolon adalah rumah keluarga besar. Rumah ini tidak memiliki sekat atau kamar sehingga keluarga tinggal dan tidur bersama. Rumah Balai Batak Toba juga dikenal sebagai Rumah Bolon.
Bagi masyarakat Batak, rumah ini tampak seperti seekor kerbau yang sedang berdiri. Pembangunan rumah adat suku Batak ini dilakukan secara gotong royong oleh masyarakat Batak. Rumah ini berbentuk seperti rumah panggung yang disangga oleh beberapa tiang penyangga.Tiang penyangga rumah biasanya terbuat dari kayu.</p>
<br><img style="margin-left:245px" src="image/rumahtoba.jpg"></img>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</article>
</div>
<footer class="dark" data-load="bawahan.html"></footer>
</body>
</html>
<div class="bg-dark">
<div class="container" style="padding: 10px 0;">
<div class="grid no-margin">
<div class="row no-margin">
<div class="span2 image-container shadow">
<img src="foto/logo.jpg" alt="" class="rounded"/>
<div class="overlay-fluid">
TB SILALAHI CENTER
</div>
</div>
<div class="span10">
<h3 class="fg-white">About authored</h3>
<p class="fg-white">All right reserved @TB SILALAHI CENTER
2017, &copy; Powered by TB SILALAHI CENTER</p>
</div>
</div>
</div>
</div>
</div><!-- top-header and slider -->
<!-- here stars scrolling icon -->
<script type="text/javascript">
$(document).ready(function() {
var defaults = {
containerID: 'toTop', // fading element id
containerHoverID: 'toTopHover', // fading element hover id
scrollSpeed: 1200,
easingType: 'linear'
};
$().UItoTop({ easingType: 'easeOutQuart' });
});
</script>
\ No newline at end of file
<?php
include "config/koneksi.php";
?>
<div class="container">
<div class="grid">
<div class="row">
<div class="border" style="background-color: #F5F5F5;">
<div class="panel no-border">
<div class="span4">
<font size="750px"><img src="foto/peta.jpg"></font>
</div>
</div>
</div>
<div class="padding200 span4" style="background-color: #F1F1F1;">
<div class="panel no-border">
<div class="panel-header ribbed-cyan fg-white">Waktu Sekarang</div>
<div class="panel-content fg-dark nlp nrp">
<center><div class="calendar" data-role="calendar"></div></center> <br />
<div class="times" data-role="times" data-style-background="bg-lightBlue" data-style-divider="fg-lightBlue"></div>
</div>
</div>
<div class="panel no-border">
<?php($bln==1){ $x="Jan"; }
($bln==2){ $x="Feb"; }
($bln==3){ $x="Mar"; }
($bln==4){ $x="Apr"; }
else if($bln==5){ $x="Mei"; }
else if($bln==6){ $x="Jun"; }
else if($bln==7){ $x="Jul"; }
else if($bln==8){ $x="Agu"; }
else if($bln==9){ $x="Sep"; }
else if($bln==10){ $x="Okt"; }
else if($bln==11){ $x="Nov"; }
else{ $x="Des"; }
?>
</div>
</div>
</div>
\ No newline at end of file
<?php
session_start();
include_once('config/koneksi.php');
open_page('booking');
?>
<!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>
<!-- Local JavaScript -->
<script src="js/docs.js"></script>
<style type="text/css">
body{background:#efefef;font-family:arial;}
#wrapshopcart{width:70%;margin:3em auto;padding:30px;background:#fff;box-shadow:0 0 15px #ddd;}
h1{margin:0;padding:0;font-size:2.5em;font-weight:bold;}
p{font-size:1em;margin:0;}
table{margin:2em 0 0 0; border:1px solid #eee;width:100%; border-collapse: separate;border-spacing:0;}
table th{background:#fafafa; border:none; padding:20px ; font-weight:normal;text-align:left;}
table td{background:#fff; border:none; padding:12px 20px; font-weight:normal;text-align:left; border-top:1px solid #eee;}
table tr.total td{font-size:1.5em;}
.btnsubmit{display:inline-block;padding:10px;border:1px solid #ddd;background:#eee;color:#000;text-decoration:none;margin:2em 0;}
form{margin:2em 0 0 0;}
label{display:inline-block;width:12em;}
input[type=text]{border:1px solid #bbb;padding:10px;width:30em;}
textarea{border:1px solid #bbb;padding:10px;width:30em;height:5em;vertical-align:text-top;margin:0.3em 0 0 0;}
.submitbtn{font-size:1.5em;display:inline-block;padding:10px;border:1px solid #ddd;background:#eee;color:#000;text-decoration:none;margin:0.5em 0 0 8em;};
</style>
<title>Booking Paket</title>
</head>
<body class="metro">
<header class="bg-darkCobalt" data-load="atasan.php"></header>
<div id="wrapshopcart">
<div class="col-md-6">
<h1>Form Pemesanan Tiket</h1>
<p>Silakan lengkapi form di bawah ini untuk melakukan pemesanan tiket: </p>
<form action="bookingprocess.php" method="POST">
<label>Nama Lengkap : </label><input type="text" name="nama"/><br />
<label>Alamat : </label><input type="text" name="alamat"/><br />
<label>Email : </label><input type="text" name="email" /><br />
<label>Kategori Tiket</label>
<select name="kategori_tiket">
<option value="Pilih kategori">---Pilih Kategori---
<option value="DEWASA">DEWASA
<option value="ANAK-ANAK">ANAK-ANAK
</select><br />
<label>Jumlah Tiket</label><input type="number" name="jumlah_tiket"><br />
<label>Jadwal Kunjungan : </label>
<input type="date" name="jadwal_berkunjung" placeholder="Date" onfocus="(this.type='date')" ></input><br />
<input type="submit" name="action" value="Pesan"> </form>
</div>
</div>
<footer class="dark" data-load="bawahan.html"></footer>
</body>
</html>
<?php session_start();
if(isset($_SESSION['username'])){
//koneksi terpusat
include "config/koneksi.php";
?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="css/print.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>
<!-- Local JavaScript -->
<script src="js/docs.js"></script>
<style>
</style>
<title>Booking Paket</title>
</head>
<body class="metro" style="background-color: #F1F1F1;">
<header class="bg-darkCobalt" data-load="atasan.php"></header>
<?php
$comot=mysql_query("SELECT * FROM tbl_pesan, tbl_paket, tbl_hotel, tbl_user WHERE tbl_pesan.id_user=tbl_user.id_user AND
tbl_pesan.id_paket=tbl_paket.id_paket AND tbl_pesan.id_hotel=tbl_hotel.id_hotel AND id_pesan=".$_GET['id']);
$isi_tbl=mysql_fetch_array($comot);
?>
<!-- ---------------------------------------- ISI TAB ------------------------------------- -->
<br />
<form>
<div class="container padding20 grid" style="background-color: #FFFFFF;">
<legend>NINA Tour dan Travel <i class="place-right"><small>Tanggal : <?php $tgl= date("d M Y"); echo $tgl;?></small></i></legend>
<div class="row">
<div class="span4">
<p class="tertiary-text-secondary"><strong>NINA Tour and Travel </strong><br />
Jalan Rimbo Kaluang<br />
No. 70 depan Gor Agus Salam<br />
Padang, Sumbar</p>
<p class="tertiary-text-secondary">ninatourtravel@yahoo.co.id<br />
085376543125</p>
<p class="tertiary-text-secondary">BCA : 3120618040 a/n Nini Gumaneri<br />
Mandiri : 1110005416478 a/n Nini Gumaneri</p>
</div>
<div class="span3">
<a class="tertiary-text-secondary"></a>To<br />
<p><strong><?php echo $isi_tbl['nama_user'];?></strong><br />
<?php echo $isi_tbl['email_user'];?><br />
Phone: <?php echo $isi_tbl['no_hp'];?><br />
<?php echo $isi_tbl['alamat'];?></p>
</div>
<div class="span4 place-right">
<p class="tertiary-text-secondary text-right">nina-00<?php echo $isi_tbl['id_pesan'];?></p>
<p class="tertiary-text-secondary text-right">Tgl Pesan: <?php echo $isi_tbl['tgl_pesan'];?><br />
Tgl Perjalanan: <?php echo $isi_tbl['tgl_tour'];?></p>
</div>
</div>
<div class="row">
<table class="table">
<thead>
<tr>
<th class="text-left" width="5%">#</th>
<th class="text-left" width="30%">Nama Paket/Penginapan</th>
<th class="text-left" width="15%">Kode</th>
<th class="text-left" width="35%">Keterangan</th>
<th class="text-center" width="15%">Biaya</th>
</tr>
</thead>
<tbody>
<tr>
<td class="text-left" width="5%">1</td>
<td class="text-left" width="30%"><?php echo $isi_tbl['nama_paket'];?></td>
<td class="text-left" width="15%">PKT14-00<?php echo $isi_tbl['id_paket'];?></td>
<td class="text-left" width="35%"><?php echo $isi_tbl['ket_paket'];?></td>
<td class="text-right" width="15%"><?php echo $isi_tbl['harga_paket'];?> IDR</td>
</tr>
<tr>
<td class="text-left" width="5%">2</td>
<td class="text-left" width="30%"><?php echo $isi_tbl['hotel'];?></td>
<td class="text-left" width="15%"><?php echo $isi_tbl['kd_daerah'];?>-HT0<?php echo $isi_tbl['id_hotel'];?></td>
<td class="text-left" width="35%"><?php $baca=substr($isi_tbl['ket_hotel'], 0, 250); echo $baca." ...";?></td>
<td class="text-right" width="15%"><?php echo $isi_tbl['harga'];?> IDR</td>
</tr>
<tr class="selected">
<td class="text-left" width="5%"></td>
<td class="text-left" width="30%"></td>
<td class="text-left" width="15%"></td>
<td class="text-left" width="35%"><strong>Total Biaya</strong></td>
<td class="text-right" width="15%"><strong><?php echo $total=$isi_tbl['harga_paket']+$isi_tbl['harga'];?></strong> IDR</td>
</tr>
</tbody>
</table>
</div>
<a class="image-button primary image-left" href="javascript:window.print()"><i class="icon-printer bg-cobalt"></i>Print</a>
<a class="image-button danger" href="ticket.php?id=<?php echo $isi_tbl['id_pesan'];?>" target="_blank">Download Tiket PDF<i class="icon-file-pdf bg-red"></i></a>
</div>
</form>
<!-- ---------------------------------------- ISI TAB ------------------------------------- -->
<footer class="dark" data-load="bawahan.html"></footer>
</body>
</html>
<?php
}else{
session_destroy();
header('Location:formRegistrasi.php?status=Silahkan Login');
}
?>
\ No newline at end of file
<?php
session_start();
include "config/koneksi.php";
?>
<!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>
<!-- Local JavaScript -->
<script src="js/docs.js"></script>
<style type="text/css">
body{background:#efefef;font-family:arial;}
#wrapshopcart{width:70%;margin:3em auto;padding:30px;background:#fff;box-shadow:0 0 15px #ddd;}
h1{margin:0;padding:0;font-size:2.5em;font-weight:bold;}
p{font-size:1em;margin:0;}
table{margin:2em 0 0 0; border:1px solid #eee;width:100%; border-collapse: separate;border-spacing:0;}
table th{background:#fafafa; border:none; padding:20px ; font-weight:normal;text-align:left;}
table td{background:#fff; border:none; padding:12px 20px; font-weight:normal;text-align:left; border-top:1px solid #eee;}
table tr.total td{font-size:1.5em;}
.btnsubmit{display:inline-block;padding:10px;border:1px solid #ddd;background:#eee;color:#000;text-decoration:none;margin:2em 0;}
form{margin:2em 0 0 0;}
label{display:inline-block;width:12em;}
input[type=text]{border:1px solid #bbb;padding:10px;width:30em;}
textarea{border:1px solid #bbb;padding:10px;width:30em;height:5em;vertical-align:text-top;margin:0.3em 0 0 0;}
.submitbtn{font-size:1.5em;display:inline-block;padding:10px;border:1px solid #ddd;background:#eee;color:#000;text-decoration:none;margin:0.5em 0 0 8em;};
</style>
<title>Booking Paket</title>
</head>
<body class="metro">
<header class="bg-darkCobalt" data-load="atasan.php"></header>
<?php
include_once('config/koneksi.php');
open_page('bookingList');
$database = new mysqli('localhost', 'root', '', 'tb silalahi');
$query = 'SELECT * FROM pemesan';
$result_set = $database->query($query);
echo('<table
border="1">');
echo('<tr>');
echo('<td>nama</td>');
echo('<td>alamat</td>');
echo('<td>email</td>');
echo('<td>kategori_tiket</td>');
echo('<td>jumlah_tiket</td>');
echo('<td>jadwal_kunjungan</td>');
echo('</tr>');
while($row = $result_set->fetch_assoc()){
echo('<tr>');
echo('<td>' .$row['nama']. '</td>');
echo('<td>' .$row['alamat']. '</td>');
echo('<td>' .$row['email']. '</td>');
echo('<td>' .$row['kategori_tiket'].
'</td>');
echo('<td>' .$row['jumlah_tiket']. '</td>');
echo('<td>' .$row['jadwal_kunjungan']. '</td>');
echo('</tr>');
}
echo('</table>');
$database->close();
close_page();
?>
<footer class="dark" data-load="bawahan.html"></footer>
</body>
</html>
<?php
session_start();
include_once('config/koneksi.php');
// retrieve posted form data
$nama = $_POST['nama'];
$alamat = $_POST['alamat'];
$email = $_POST['email'];
$kategori_tiket = $_POST['kategori_tiket'];
$jumlah_tiket = $_POST['jumlah_tiket'];
$jadwal_kunjungan = $_POST['jadwal_berkunjung'];
//echo $nama . " " . $alamat." ". $kategori_tiket ." ". $jumlah_tiket." ".$jadwal_kunjungan;
//die();
$database = new mysqli('localhost', 'root', '', 'tb silalahi');
$query = 'INSERT INTO pemesan(`id`, `nama`, `alamat`,
`email`, `kategori_tiket`, `jumlah_tiket`, `jadwal_kunjungan`) VALUES(?, ?, ?, ?, ?, ?, ?)';
$statement = $database->prepare($query);
$statement -> bind_param('issssis', $id, $nama, $alamat,
$email, $kategori_tiket, $jumlah_tiket, $jadwal_kunjungan);
$statement -> execute();
redirect('bookingList.php');
?>
<!-- Start of Zopim Live Chat Script -->
<script type="text/javascript">
window.$zopim||(function(d,s){var z=$zopim=function(c){z._.push(c)},$=z.s=
d.createElement(s),e=d.getElementsByTagName(s)[0];z.set=function(o){z.set.
_.push(o)};z._=[];z.set._=[];$.async=!0;$.setAttribute('charset','utf-8');
$.src='//v2.zopim.com/?1xmf5GilD16byKObrVC7yChVx1fbFF8H';z.t=+new Date;$.
type='text/javascript';e.parentNode.insertBefore($,e)})(document,'script');
</script>
<!--End of Zopim Live Chat Script -->
\ No newline at end of file
var xmlhttp = createRequestObject();
function createRequestObject() {
var ro;
var browser = navigator.appName;
if(browser == "Microsoft Internet Explorer"){
ro = new ActiveXObject("Microsoft.XMLHTTP");
}else{
ro = new XMLHttpRequest();
}
return ro;
}
function DinamisDaerah(combobox)
{
var kode = combobox.value;
if (!kode) return;
xmlhttp.open('get', 'combo/get_hotel-opr.php?kode='+kode, true);
xmlhttp.onreadystatechange = function() {
if ((xmlhttp.readyState == 4) && (xmlhttp.status == 200))
{
document.getElementById("hotel").innerHTML = xmlhttp.responseText;
}
return false;
}
xmlhttp.send(null);
}
function DinamisKategori(combobox)
{
var kode = combobox.value;
if (!kode) return;
xmlhttp.open('get', 'combo/get_paket-opr.php?kode='+kode, true);
xmlhttp.onreadystatechange = function() {
if ((xmlhttp.readyState == 4) && (xmlhttp.status == 200))
{
document.getElementById("paket").innerHTML = xmlhttp.responseText;
}
return false;
}
xmlhttp.send(null);
}
\ No newline at end of file
<!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>
<!-- Local JavaScript -->
<script src="js/docs.js"></script>
<style>
</style>
<title>Contact</title>
</head>
<body class="metro">
<header class="bg-darkCobalt" data-load="atasan.php"></header>
<div class="" data-load="slider.php"></div>
<br />
<!-- ---------------------------------------- ISI TAB ------------------------------------- -->
<div class="container">
<div class="panel" data-role="panel">
<div class="panel-header bg-darkRed fg-white">
Contact
</div>
<div class="panel-content">
<?php
include "config/koneksi.php";
$comot= mysql_query("SELECT * FROM contact LIMIT 1");
$ngisi= mysql_fetch_array($comot);
?>
<div class="grid">
<div class="row">
<div class="span4">
<table class="table hovered">
<tbody>
<tr class=""><td>Alamat</td><td class="right"><?php echo $ngisi['alamat']; ?></td></tr>
<tr class=""><td>Kota</td><td class="right"><strong><?php echo $ngisi['kota']; ?></strong></td></tr>
<tr class=""><td>E-mail</td><td class="right"><strong><?php echo $ngisi['email']; ?></strong></td></tr>
<tr class=""><td>Telepon</td><td class="right"><strong><?php echo $ngisi['no_tlp']; ?></strong></td></tr>
<tr class=""><td>Handphone</td><td class="right"><strong><?php echo $ngisi['no_hp']; ?></strong></td></tr>
</tbody>
</table>
</div>
<div class="span8">
<p><?php echo $ngisi['content']; ?></p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- ---------------------------------------- ISI TAB ------------------------------------- -->
<br />
<footer class="dark" data-load="bawahan.html"></footer>
</body>
</html>
\ No newline at end of file
File added
.atas{
background-color:black;
margin-top:-8px;
width:101.2%;
margin-left:-8px;
}
.atas a{
text-decoration:none;
color:white;
}
.isi_konten .isi{
margin-top:5px;
margin-left:auto;
margin-right:auto;
width:90%;
position:relative;}
.isi_konten .isi .isi_teks{
width:97%;
float:right;
color:black;
font-size:14px;}
.isi_teks .list_semester li{
cursor:pointer;}
.isi_teks .list_semester span{
display:none;}
p{
font-family:High Tower Text;
font-size:20px;
text-align:justify;
}
.isi_teks li{
margin:3px 0px;}
.isi_kurikulum{
position:absolute;
width:100%;}
.definisi_pembungkus {
width: 875px;
height: 795px;
position: relative;
top:40px;
margin-left:-4px;
margin-right: auto;
overflow: hidden;
}
.definisi_pembungkus div{
width:150px;
height:70px;
position:relative;
clear:both;
cursor:default;
overflow:hidden;
border-radius: 20px 20px 20px 20px;
}
.definisi_pembungkus .isi_definisi{
cursor:pointer;
transition:width 2s, height 2s;}
.definisi_pembungkus .isi_definisi:hover{
width:99.6%;
height:99.5%;
z-index:1;
}
.definisi_pembungkus .isi_definisi2{
cursor:pointer;
transition:width 2s, height 2s, margin-top 2s;}
.definisi_pembungkus .isi_definisi2:hover{
width:99.6%;
height:100%;
margin-top:-230px;
z-index:1;}
.definisi_pembungkus div h2{
text-align:center;
position:relative;
top:5px;}
.definisi_pembungkus .gambar_kepala{
margin-left:-50px;
margin-top: 30px;
width: 90%;
height: 900px;
}
.gambar_kepala p
{
margin-left: 20%;
margin-top: 8px;
}
.definisi_pembungkus .isi_definisi, .definisi_pembungkus .isi_definisi2{
background:#c5c2ef;
box-shadow: 0 0 15px #eaa0a0;
}
\ No newline at end of file
@import url(http://fonts.googleapis.com/css?family=Raleway:200,300,400,700);
@font-face {
font-weight: normal;
font-style: normal;
font-family: 'codropsicons';
src:url('../fonts/codropsicons/codropsicons.eot');
src:url('../fonts/codropsicons/codropsicons.eot?#iefix') format('embedded-opentype'),
url('../fonts/codropsicons/codropsicons.woff') format('woff'),
url('../fonts/codropsicons/codropsicons.ttf') format('truetype'),
url('../fonts/codropsicons/codropsicons.svg#codropsicons') format('svg');
}
*, *:after, *:before { -webkit-box-sizing: border-box; box-sizing: border-box; }
.clearfix:before, .clearfix:after { content: ''; display: table; }
.clearfix:after { clear: both; }
body, html, .container {
height: 100%;
}
body {
background: #fff;
color: #74777b;
font-weight: 500;
font-size: 1em;
font-family: 'Raleway', Arial, sans-serif;
}
a {
color: #2fa0ec;
text-decoration: none;
outline: none;
}
a:hover, a:focus {
color: #74777b;
}
.color-1 {
background: #434d55;
color: #eee;
}
.color-2 {
background: #47c9af;
color: #fff;
}
.color-2 a {
color: rgba(0,0,0,0.3);
}
.color-2 a:hover,
.color-2 a:focus {
color: #fff;
}
.color-3 {
#color: #fff;
#background: #566473;
}
.color-3 a {
color: rgba(58,77,97,0.8);
}
.color-3 a:hover,
.color-3 a:focus {
color: #fff;
}
.color-3 .container {
#background: url(../img/map.jpg) no-repeat 50% 50%;
background-size: cover;
min-height: 1000px;
}
.color-4 {
color: rgba(102,49,54,0.8);
background: #dd5864;
}
.color-4 a {
color: rgba(255,255,255,0.9);
}
.color-4 a:hover,
.color-4 a:focus {
color: #fff;
}
.color-5 {
background: #e4eaea;
}
.color-5 .codrops-demos a {
color: #e35583;
}
.color-6 {
background: #ffdab9;
}
.color-6 a {
color: #e74c3c;
}
.color-6 a:hover,
.color-6 a:focus {
color: #74777b;
}
.color-7 {
color: #fff;
background: #f08080;
}
.color-7 a {
color: #fffaf0;
}
.color-7 a:hover,
.color-7 a:focus {
color: #fff;
}
.color-8 {
color: #fff;
background: #2f3238;
}
.color-8 a {
color: #ddd;
}
.color-8 a:hover,
.color-8 a:focus {
color: #fff;
}
.content {
padding: 0 1em;
margin: 0 auto;
text-align: center;
}
/* Header */
.codrops-header {
padding: 1em 0 3em;
letter-spacing: -1px;
}
.codrops-header h1 {
font-weight: 800;
font-size: 4.5em;
line-height: 1;
}
.codrops-header h1 span {
display: block;
font-size: 50%;
font-weight: 200;
padding-top: 0.325em;
opacity: 0.6;
}
/* To Navigation Style */
.codrops-top {
width: 100%;
text-transform: uppercase;
font-weight: 700;
font-size: 0.69em;
line-height: 2.2;
}
.codrops-top a {
display: inline-block;
padding: 1em 2em;
text-decoration: none;
letter-spacing: 1px;
}
.codrops-top span.right {
float: right;
}
.codrops-top span.right a {
display: block;
float: left;
}
.codrops-icon:before {
margin: 0 4px;
text-transform: none;
font-weight: normal;
font-style: normal;
font-variant: normal;
font-family: 'codropsicons';
line-height: 1;
speak: none;
-webkit-font-smoothing: antialiased;
}
.codrops-icon-drop:before {
content: "\e001";
}
.codrops-icon-prev:before {
content: "\e004";
}
/* Codrops demo links */
.codrops-demos {
margin: 0 auto;
}
.codrops-demos a {
font-weight: 700;
text-transform: uppercase;
letter-spacing: 1px;
padding: 0.25em 0;
margin: 5px 10px;
display: inline-block;
font-size: 0.85em;
}
.codrops-demos a.current-demo {
opacity: 0.5;
}
/* Related demos */
.related {
text-align: center;
padding: 8em 0;
clear: both;
}
.related > a {
width: calc(100% - 20px);
max-width: 340px;
border: 1px solid rgba(0,0,0,0.3);
color: rgba(0,0,0,0.3);
display: inline-block;
text-align: center;
border-radius: 4px;
margin: 20px 10px;
padding: 25px;
}
.related a img {
max-width: 100%;
opacity: 0.8;
}
.related a:hover img,
.related a:active img {
opacity: 1;
}
.related a h3 {
margin: 0;
padding: 0.5em 0 0.3em;
max-width: 300px;
text-align: left;
}
/* Dummy elements */
.dummy {
text-align: left;
padding: 1em;
min-height: 300px;
margin: 0 auto;
font-weight: 300;
}
.dummy-text {
max-width: 1000px;
font-size: 1.65em;
}
.info {
margin: 0 auto;
text-align: center;
max-width: 600px;
font-size: 13px;
padding: 2em 0;
}
.dummy-text p {
margin-top: 0;
line-height: 1.8;
text-align: justify;
}
.dummy-text h3 {
font-weight: 700;
text-transform: uppercase;
letter-spacing: 2px;
font-size: 1em;
margin: 2em 0 1em;
}
.dummy-menu {
max-width: 100%;
padding: 4em 1em;
}
.dummy-menu ul,
.dummy-team ul {
list-style: none;
text-align: center;
padding: 0;
margin: 0 0 3em;
}
.dummy-menu ul li {
display: inline-block;
position: relative;
margin: 0 1em;
font-size: 1.5em;
}
.dummy-menu ul li a {
display: inline-block;
font-weight: 700;
padding: 0.15em 0.25em 0;
-webkit-transition: color 0.3s;
transition: color 0.3s;
}
.dummy-menu-icons ul li {
width: 2em;
height: 2em;
font-size: 2em;
line-height: 1.75;
}
.dummy-image {
position: relative;
}
.dummy blockquote {
font-family: 'Kalam', cursive;
font-size: 2.5em;
max-width: 700px;
text-align: center;
margin: 0 auto;
}
.dummy blockquote footer {
font-size: 0.5em;
}
.dummy blockquote footer::before {
content: '—';
}
.dummy-avatar {
margin-top: 7em;
text-align: center;
}
.dummy-avatar > div {
display: inline-block;
margin: 0 1em;
}
.dummy-avatar a {
margin: 0 auto;
display: block;
text-align: center;
-webkit-transition: color 0.3s;
transition: color 0.3s;
}
.dummy-avatar a img {
border-radius: 50%;
}
.dummy-avatar a h4 {
margin: 0.25em 0;
line-height: 1;
font-size: 1.75em;
font-weight: 400;
}
@media screen and (max-width: 27em) {
.codrops-icon {
font-size: 1.5em;
}
.codrops-icon span {
display: none;
}
}
\ No newline at end of file
body {
height: 100%;
margin: 0;
padding: 0;
}
.metro .page {
width: 980px;
margin: 0 auto;
padding: 0 20px;
}
.description {
margin: 10px 0;
}
.show-grid .row [class*="span"] {
line-height: 40px;
background: rgba(193, 179, 123, 0.52);
text-align: center;
min-height: 10px !important;
}
.color-stack li,
#icon-list li {
margin-bottom: 5px;
}
.example > img {
margin: 5px;
display: inline-block;
}
.example .image-container {
margin: 10px;
display: inline-block;
vertical-align: middle;
}
.layout {
min-height: 100%;
position: relative;
}
header {
height: 45px;
position: relative;
}
footer {
width: 100%;
height: 25px;
}
@media only screen and (max-width: 640px) {
.prettyprint,
.example {
display: none;
}
}
@import "../../../less/variables";
body {
height: 100%;
margin: 0;
padding: 0;
}
.metro .page {
width: 980px;
margin: 0 auto;
padding: 0 20px;
}
.description {
margin: 10px 0;
}
.show-grid .row [class*="span"]{
line-height: 40px;
background: rgba(193, 179, 123, 0.52);
text-align: center;
min-height: 10px !important;
}
.color-stack li, #icon-list li {
margin-bottom: 5px;
}
.example > img {
margin: 5px;
display: inline-block;
}
.example .image-container {
margin: 10px;
display: inline-block;
vertical-align: middle;
}
.layout {
min-height: 100%;
position: relative;
}
header {
height: 45px;
position: relative;
//z-index: 1;
}
footer {
width: 100%;
height: 25px;
}
@media only screen and (max-width: 640px) {
.prettyprint, .example {
display: none;
}
}
\ No newline at end of file
html{
height:100%;
margin:0;
min-height:100%;
padding:0;
width:100%;
background-color:#333;
}
body{
height:100%;
margin:0 auto;
min-height:100%;
padding:0;
width:980px;
}
#container{
width:100%;
height:100%;
background:-moz-linear-gradient(center top , #FFFFFF, #efefef) repeat scroll 0 0 transparent;
background:-webkit-gradient(linear,left top,left bottom,color-stop(0, #FFFFFF),color-stop(1, #efefef));
}
a{
color: rgb(0, 114, 191); text-decoration: none;
}
.msg{
font-size:18px;
color:#555;
text-align:center;
}
.legal{
text-align:center;
color:5f5f5f;
background-color:#DEDEDE;
font-size:16px;
margin-top:100px;
}
.label{
font-size:24px;
color:#777;
margin-top:20px;
text-align:center;
}
.clearfix{
clear:both;
float:none;
}
/*
* Devices
* min 1200
* min 1024
* max 1024
* max 768
* max 640
* max 480
* max 320
*/
#responsive-utils .hide-element {
display: none !important;
visibility: hidden !important;
}
#responsive-utils .show-element {
display: block !important;
visibility: visible !important;
}
#responsive-utils .full-size {
float: none !important;
display: block !important;
width: 100% !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
#responsive-utils .half-size {
width: 50% !important;
}
#responsive-utils .container-desktop {
width: 940px !important;
}
#responsive-utils .container-phone {
width: 100% !important;
}
#responsive-utils .container-phone2 {
width: 100% !important;
}
#responsive-utils .container-phone3 {
width: 100% !important;
}
#responsive-utils .container-phone4 {
width: 100% !important;
}
#responsive-utils .container-tablet {
width: 720px !important;
}
#responsive-utils .container-large {
width: 1140px !important;
}
#responsive-utils .container-phone {
padding: 0 10px;
}
/* Desktop */
@media screen and (min-width: 800px) {
.no-desktop {
display: none !important;
visibility: hidden !important;
}
}
@media screen and (min-width: 1024px) {
.no-desktop {
display: none !important;
visibility: hidden !important;
}
.on-desktop {
display: block !important;
visibility: visible !important;
}
.container {
width: 940px !important;
}
}
/* Large desktop */
@media screen and (min-width: 1200px) {
html {
font-size: 70%;
}
.no-large {
display: none !important;
visibility: hidden !important;
}
.on-large {
display: block !important;
visibility: visible !important;
}
.container {
width: 1140px !important;
}
}
/* tablet landscape*/
@media only screen and (max-width: 1024px) {
.no-tablet-landscape,
.no-tablet {
display: none !important;
visibility: hidden !important;
}
.on-tablet {
display: block !important;
visibility: visible !important;
}
.container {
width: 940px !important;
}
}
/* tablet portrait */
@media only screen and (max-width: 800px) {
html {
font-size: 60%;
}
.no-tablet-portrait,
.no-tablet {
display: none !important;
visibility: hidden !important;
}
.on-tablet {
display: block !important;
visibility: visible !important;
}
.container {
width: 720px !important;
}
.grid:not(.fluid) > .row {
margin: 0;
}
.grid:not(.fluid) > .row > [class*="span"] {
width: 350px !important;
margin-left: 0 !important;
margin-bottom: 20px;
}
.grid:not(.fluid) > .row > [class*="span"]:nth-child(even) {
margin-left: 20px !important;
}
.grid:not(.fluid) > .row .span12,
.grid:not(.fluid) > .row .span7,
.grid:not(.fluid) > .row .span8,
.grid:not(.fluid) > .row .span9,
.grid:not(.fluid) > .row .span10,
.grid:not(.fluid) > .row .span11 {
width: 720px !important;
}
.grid:not(.fluid) > .row .span12:nth-child(even),
.grid:not(.fluid) > .row .span7:nth-child(even),
.grid:not(.fluid) > .row .span8:nth-child(even),
.grid:not(.fluid) > .row .span9:nth-child(even),
.grid:not(.fluid) > .row .span10:nth-child(even),
.grid:not(.fluid) > .row .span11:nth-child(even) {
margin-left: 0 !important;
}
.grid:not(.fluid) > .row .row {
margin: 0;
}
.grid:not(.fluid) > .row .row [class*="span"] {
width: 350px !important;
margin-left: 0 !important;
margin-bottom: 20px;
}
.grid:not(.fluid) > .row .row [class*="span"]:nth-child(even) {
margin-left: 20px !important;
}
.grid:not(.fluid) > .row .row .span12,
.grid:not(.fluid) > .row .row .span7,
.grid:not(.fluid) > .row .row .span8,
.grid:not(.fluid) > .row .row .span9,
.grid:not(.fluid) > .row .row .span10,
.grid:not(.fluid) > .row .row .span11 {
width: 720px !important;
}
.grid:not(.fluid) > .row .row .span12:nth-child(even),
.grid:not(.fluid) > .row .row .span7:nth-child(even),
.grid:not(.fluid) > .row .row .span8:nth-child(even),
.grid:not(.fluid) > .row .row .span9:nth-child(even),
.grid:not(.fluid) > .row .row .span10:nth-child(even),
.grid:not(.fluid) > .row .row .span11:nth-child(even) {
margin-left: 0 !important;
}
.navigation-bar,
.navbar {
position: relative !important;
}
.navigation-bar .pull-menu,
.navbar .pull-menu {
display: block !important;
}
.navigation-bar .element,
.navbar .element {
float: none !important;
}
.navigation-bar .element-divider,
.navbar .element-divider {
display: none !important;
}
.navigation-bar .element-menu,
.navbar .element-menu {
position: relative;
float: none;
display: none;
width: 100% !important;
background-color: inherit;
z-index: 1000;
}
.navigation-bar .element-menu li,
.navbar .element-menu li {
display: block !important;
float: none !important;
width: 100%;
}
.navigation-bar .element-menu li a,
.navbar .element-menu li a {
display: block !important;
float: none !important;
width: 100%;
}
.navigation-bar .element-menu li .dropdown-menu,
.navbar .element-menu li .dropdown-menu {
position: relative !important;
left: 0;
}
.navigation-bar .element-menu .dropdown-toggle,
.navbar .element-menu .dropdown-toggle {
color: inherit;
position: relative;
}
.navigation-bar .element-menu .dropdown-toggle:after,
.navbar .element-menu .dropdown-toggle:after {
position: absolute;
left: 100% !important;
margin-left: -15px;
}
}
@media only screen and (max-width: 800px) {
.navigation-bar .pull-menu,
.navbar .pull-menu {
display: block !important;
}
}
/* Phones landscape*/
@media only screen and (max-width: 640px) {
html {
font-size: 60%;
}
.no-phone-landscape,
.no-phone {
display: none !important;
visibility: hidden !important;
}
.on-phone {
display: block !important;
visibility: visible !important;
}
.container {
width: 100% !important;
padding: 0 10px;
}
.grid:not(.fluid) > .row {
margin: 0;
}
.grid:not(.fluid) > .row > [class*="span"] {
width: 100% !important;
margin: 0 !important;
margin-bottom: 5px !important;
}
.grid:not(.fluid) > .row > [class*="span"]:nth-child(even) {
margin-left: 0 !important;
}
.grid:not(.fluid) > .row .span12 {
width: 100% !important;
}
.grid:not(.fluid) > .row .row {
margin: 0;
}
.grid:not(.fluid) > .row .row > [class*="span"] {
width: 100% !important;
margin: 0 !important;
margin-bottom: 5px !important;
}
.grid:not(.fluid) > .row .row > [class*="span"]:nth-child(even) {
margin-left: 0 !important;
}
.grid:not(.fluid) > .row .row .span12 {
width: 100% !important;
}
}
/* Phones portrait*/
@media only screen and (max-width: 480px) {
html {
font-size: 45%;
}
.no-phone-landscape,
.no-phone {
display: none !important;
visibility: hidden !important;
}
.container {
width: 100% !important;
}
}
@media only screen and (max-width: 360px) {
html {
font-size: 40%;
}
.no-phone-portrait,
.no-phone {
display: none !important;
visibility: hidden !important;
}
.container {
width: 100% !important;
}
}
@media only screen and (max-width: 320px) {
html {
font-size: 40%;
}
.no-phone-portrait,
.no-phone {
display: none !important;
visibility: hidden !important;
}
.container {
width: 100% !important;
}
}
This source diff could not be displayed because it is too large. You can view the blob instead.
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block;}audio,canvas,video{display:inline-block;}audio:not([controls]){display:none;height:0;}[hidden]{display:none;}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}body{margin:0;}a:focus{outline:thin dotted;}a:active,a:hover{outline:0;}h1{font-size:2em;margin:0.67em 0;}abbr[title]{border-bottom:1px dotted;}b,strong{font-weight:bold;}dfn{font-style:italic;}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;}mark{background:#ff0;color:#000;}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em;}pre{white-space:pre-wrap;}q{quotes:"\201C" "\201D" "\2018" "\2019";}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sup{top:-0.5em;}sub{bottom:-0.25em;}img{border:0;}svg:not(:root){overflow:hidden;}figure{margin:0;}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}legend{border:0;padding:0;}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0;}button,input{line-height:normal;}button,select{text-transform:none;}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;}button[disabled],html input[disabled]{cursor:default;}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}textarea{overflow:auto;vertical-align:top;}table{border-collapse:collapse;border-spacing:0;}
\ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
@import url(http://fonts.googleapis.com/css?family=Gochi+Hand);
.tooltip {
position: absolute;
z-index: 999;
width: 1.em;
height: 1.em;
cursor: pointer;
}
/* Trigger item */
.tooltip-item {
width: 30px;
height: 30px;
left: 50%;
top: 50%;
margin: -15px 0 0 -15px;
position: absolute;
border-radius: 50%;
border: 2px solid #e35583;
-webkit-animation: pulse 0.6s infinite alternate;
animation: pulse 0.6s infinite alternate;
}
@-webkit-keyframes pulse {
from { -webkit-transform: scale3d(0.5,0.5,1); }
to { -webkit-transform: scale3d(1,1,1); }
}
@keyframes pulse {
from { -webkit-transform: scale3d(0.5,0.5,1); transform: scale3d(0.5,0.5,1); }
to { -webkit-transform: scale3d(1,1,1); transform: scale3d(1,1,1); }
}
.tooltip:hover .tooltip-item {
border-color: #fff;
}
/*Souvenir Shop*/
.tooltip:first-child {
top: -164%;
left: 20%;
}
/*Museum TB*/
.tooltip:nth-child(2) {
top: -100%;
left: 66%;
}
/*Kolam Renang*/
.tooltip:nth-child(3) {
top: -194%;
right: 10%;
}
/*Gerbang*/
.tooltip:nth-child(4) {
top: -100%;
left: 22%;
}
/*Cafetaria*/
.tooltip:nth-child(5) {
top: -13%;
left: 40%;
}
/*Huta Batak*/
.tooltip:nth-child(6) {
top: -140%;
left: 91%;
}
/*Museum Batak*/
.tooltip:nth-child(7) {
top: -80%;
left: 90%;
}
/* Tooltip */
.tooltip-content {
position: absolute;
background: black;
z-index: 9999;
width: 600px;
height:400 px;
bottom: 100%;
margin-bottom: -1em;
padding: 20px;
border-radius: 20px;
font-size: 1.1em;
text-align: left;
color: #fff;
opacity: 0;
cursor: default;
pointer-events: none;
font-family: 'Gochi Hand', cursive;
-webkit-font-smoothing: antialiased;
-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
transition: opacity 0.3s, transform 0.3s;
}
.tooltip-west .tooltip-content {
left: 4em;
-webkit-transform-origin: -2em 50%;
transform-origin: -2em 50%;
-webkit-transform: translate3d(0,50%,0) rotate3d(1,1,1,30deg);
transform: translate3d(0,50%,0) rotate3d(1,1,1,30deg);
}
.tooltip-east .tooltip-content {
right: 4em;
-webkit-transform-origin: calc(100% + 2em) 50%;
transform-origin: calc(100% + 2em) 50%;
-webkit-transform: translate3d(0,50%,0) rotate3d(1,1,1,-30deg);
transform: translate3d(0,50%,0) rotate3d(1,1,1,-30deg);
}
.tooltip:hover .tooltip-content {
opacity: 1;
-webkit-transform: translate3d(0,50%,0) rotate3d(0,0,0,0);
transform: translate3d(0,50%,0) rotate3d(0,0,0,0);
pointer-events: auto;
}
/* Gap "bridge" and arrow */
.tooltip-content::before,
.tooltip-content::after {
content: '';
position: absolute;
}
.tooltip-content::before {
height: 100%;
width: 3em;
}
.tooltip-content::after {
width: 2em;
height: 2em;
top: 50%;
margin: -1em 0 0;
background: url(../img/tooltip2.svg) no-repeat center center;
background-size: 100%;
}
.tooltip-west .tooltip-content::before,
.tooltip-west .tooltip-content::after {
right: 99%; /* because of FF, otherwise we have a gap */
}
.tooltip-east .tooltip-content::before,
.tooltip-east .tooltip-content::after {
left: 99%; /* because of FF, otherwise we have a gap */
}
.tooltip-east .tooltip-content::after {
-webkit-transform: scale3d(-1,1,1);
transform: scale3d(-1,1,1);
}
.tooltip-content img {
position: relative;
height: 170px;
display: block;
float: left;
margin-right: 1em;
}
\ No newline at end of file
<!DOCTYPE html>
<html lang="en" class="no-js">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Denah Lokasi TB SILALAHI CENTER</title>
<meta name="description" content="Various hover tooltip styles, shapes and effects for your inspiration" />
<meta name="keywords" content="tooltip, effect, style, inspiration, css, svg, animation" />
<meta name="author" content="Codrops" />
<link rel="shortcut icon" href="../favicon.ico">
<link rel="stylesheet" type="text/css" href="css/normalize.css" />
<link rel="stylesheet" type="text/css" href="css/demo.css" />
<link rel="stylesheet" href="fonts/font-awesome-4.2.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="css/tooltip-curved.css" />
<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body >
<img src="./img/map.jpg">
<!-- Top Navigation -->
<div class="content">
<div class="dummy dummy-image" >
<div class="dummy-pois">
<!--Souvenir Shop-->
<div class="tooltip tooltip-west">
<span class="tooltip-item"></span>
<span class="tooltip-content">
<img src="img/souvenir.jpg" />
Gallery Souvenir Shop<br>
<p>Seperti tempat wisata umumnya, Museum TB SILALAHI CENTER juga memiliki tempat untuk membeli souvenir khas Batak.
Untuk membeli souvenir khas dari Museum ini, Anda bisa mengunjungi GALLERY yang ada di luar lokasi TB SILALAHI CENTER.
Di Gallery ini Anda bisa membeli souvenir berupa pakaian, accesooris dan souvenir lainnya.</p>
<p>Terimakasih ata Kunjungan Anda dan Selamat Berbelanja!</p>
</span>
</div>
<!--Museum TB-->
<div class="tooltip tooltip-east">
<span class="tooltip-item"></span>
<span class="tooltip-content">
<img src="img/tb.jpg" />
Museum TB SILALAHI<br>
<p>Museum TB SILALAHI ini merupakan tempat koleksi-koleksi yang dimiliki oleh pemilik Museum ini yaitu TB SILALAHI CENTER
Museum ini terletak pas di depan loket pembayaran Loket. Pada Museum ini kita akan melihat koleksi-koleksi yang dimiliki oleh TB SILALAHI CENTER.
Koleksinya dimulai dari seragam yang pernah dipakai, kendaraan tua nya, jam tangan dan juga perpustakaan sederhana.</p>
</span>
</div>
<!--Kolam-->
<div class="tooltip tooltip-east">
<span class="tooltip-item"></span>
<span class="tooltip-content">
<img src="img/kolam.jpg" />
<br><br><br>
Kolam Renang<br>
Jika anda merasa lelah setelah mengunjungi Museum ini dan melihat segala fitur yang ada dalam Museum ini,
Silahkan nikmasti nuansa berenang di kolam renang TB SILALAHI CENTER. Kolam ini terletak di luar lokasi Museum. Berjarak sekitar 50 m dari gerbang utama.<p><br>
Selamat Menikmati!
</span>
<!--Gerbang-->
</div>
<div class="tooltip tooltip-west">
<span class="tooltip-item"></span>
<span class="tooltip-content">
<img src="img/gerbang.jpg" />
Gerbang Utama<br>
<p>Gerbang utama ini adalah lokasi utama yang harus dilalui oleh pengunjung. Dari pintu masuk ini akan ada pemeriksaan barang-barang bawaan pengunjung.
Hal ini dilakukan guna menghindari hal-hal yang tidak diingikan. Setelah memasuki Gerbang pengunjung juga aka ada loket untuk membeli tiket. Jika anda
memesan tiket online dari sistem ini Anda cukup membawa print keterangan pemesanan online tersebut. Namun jika manual, Anda bisa membelinya langsung di loket tersebut.</p>
Selamat Berkunjung!
</span>
</div>
<!--Cafetaria-->
<div class="tooltip tooltip-west">
<span class="tooltip-item"></span>
<span class="tooltip-content">
<img src="img/cafe.jpg" />
Cafetaria<br>
<p>Di Cafetaria ini Anda bisa beristirahat sejenak sambil menonton pada layar lebar yang ada di Museum Batak. Cafetaria ini menawarkan aneka jenis makanan dan minuman dan juga snack untuk pengunjung.
Selain letak yang strategis suasana yang ada pada cafetaria ini juga cukup membuat suasana nyaman bagi pengunjung.</p></br>
Selamat Berkunjung!
</span>
</div>
<!--Huta Batak-->
<div class="tooltip tooltip-east">
<span class="tooltip-item"></span>
<span class="tooltip-content">
<img src="img/hutabatak.jpg" />
Huta Batak<br>
<p>Jika anda ingin mengetahui dan melihat bagaimana suasana perkampungan(huta) jaman dahulu, Museum Tb SILALAHI CENTER
memiliki tempat yang Anda maksud. Di Huta Batak ini, Anda akan melihat bagaimana rumah adat, gambaran suasana kehidupan masyarakat jaman dahulu.
Tidak ketinggalan juga di Huta Batak ini juga ada Patung Sigale-Gale. Sehingga semakin menarik.</p></br>
Silahkan Berkunjung!
</span>
</div>
<!--Museum Batak-->
<div class="tooltip tooltip-east">
<span class="tooltip-item"></span>
<span class="tooltip-content">
<img src="img/batak.jpg" />
Museum Batak<br>
Di Museum inilah kita bisa melihat koleksi-koleksi peninggalan jaman dahulu. Di Museum ini Anda akan melihat koleksinya mulai dari pakaian adat, pedang, lukisan, miniatur dan yang lainnya.</p>
<br>Selamat berkunjung!
</span>
</div>
</div>
</div>
</div>
</div><!-- /content -->
</body>
</html>
\ No newline at end of file
File added
@import url(http://fonts.googleapis.com/css?family=Raleway:200,300,400,700);
@font-face {
font-weight: normal;
font-style: normal;
font-family: 'codropsicons';
src:url('../fonts/codropsicons/codropsicons.eot');
src:url('../fonts/codropsicons/codropsicons.eot?#iefix') format('embedded-opentype'),
url('../fonts/codropsicons/codropsicons.woff') format('woff'),
url('../fonts/codropsicons/codropsicons.ttf') format('truetype'),
url('../fonts/codropsicons/codropsicons.svg#codropsicons') format('svg');
}
*, *:after, *:before { -webkit-box-sizing: border-box; box-sizing: border-box; }
.clearfix:before, .clearfix:after { content: ''; display: table; }
.clearfix:after { clear: both; }
body, html, .container {
height: 100%;
}
body {
background: #fff;
color: #74777b;
font-weight: 500;
font-size: 1em;
font-family: 'Raleway', Arial, sans-serif;
}
a {
color: #2fa0ec;
text-decoration: none;
outline: none;
}
a:hover, a:focus {
color: #74777b;
}
.color-1 {
background: #434d55;
color: #eee;
}
.color-2 {
background: #47c9af;
color: #fff;
}
.color-2 a {
color: rgba(0,0,0,0.3);
}
.color-2 a:hover,
.color-2 a:focus {
color: #fff;
}
.color-3 {
#color: #fff;
#background: #566473;
}
.color-3 a {
color: rgba(58,77,97,0.8);
}
.color-3 a:hover,
.color-3 a:focus {
color: #fff;
}
.color-3 .container {
#background: url(../img/map.jpg) no-repeat 50% 50%;
background-size: cover;
min-height: 1000px;
}
.color-4 {
color: rgba(102,49,54,0.8);
background: #dd5864;
}
.color-4 a {
color: rgba(255,255,255,0.9);
}
.color-4 a:hover,
.color-4 a:focus {
color: #fff;
}
.color-5 {
background: #e4eaea;
}
.color-5 .codrops-demos a {
color: #e35583;
}
.color-6 {
background: #ffdab9;
}
.color-6 a {
color: #e74c3c;
}
.color-6 a:hover,
.color-6 a:focus {
color: #74777b;
}
.color-7 {
color: #fff;
background: #f08080;
}
.color-7 a {
color: #fffaf0;
}
.color-7 a:hover,
.color-7 a:focus {
color: #fff;
}
.color-8 {
color: #fff;
background: #2f3238;
}
.color-8 a {
color: #ddd;
}
.color-8 a:hover,
.color-8 a:focus {
color: #fff;
}
.content {
padding: 0 1em;
margin: 0 auto;
text-align: center;
}
/* Header */
.codrops-header {
padding: 1em 0 3em;
letter-spacing: -1px;
}
.codrops-header h1 {
font-weight: 800;
font-size: 4.5em;
line-height: 1;
}
.codrops-header h1 span {
display: block;
font-size: 50%;
font-weight: 200;
padding-top: 0.325em;
opacity: 0.6;
}
/* To Navigation Style */
.codrops-top {
width: 100%;
text-transform: uppercase;
font-weight: 700;
font-size: 0.69em;
line-height: 2.2;
}
.codrops-top a {
display: inline-block;
padding: 1em 2em;
text-decoration: none;
letter-spacing: 1px;
}
.codrops-top span.right {
float: right;
}
.codrops-top span.right a {
display: block;
float: left;
}
.codrops-icon:before {
margin: 0 4px;
text-transform: none;
font-weight: normal;
font-style: normal;
font-variant: normal;
font-family: 'codropsicons';
line-height: 1;
speak: none;
-webkit-font-smoothing: antialiased;
}
.codrops-icon-drop:before {
content: "\e001";
}
.codrops-icon-prev:before {
content: "\e004";
}
/* Codrops demo links */
.codrops-demos {
margin: 0 auto;
}
.codrops-demos a {
font-weight: 700;
text-transform: uppercase;
letter-spacing: 1px;
padding: 0.25em 0;
margin: 5px 10px;
display: inline-block;
font-size: 0.85em;
}
.codrops-demos a.current-demo {
opacity: 0.5;
}
/* Related demos */
.related {
text-align: center;
padding: 8em 0;
clear: both;
}
.related > a {
width: calc(100% - 20px);
max-width: 340px;
border: 1px solid rgba(0,0,0,0.3);
color: rgba(0,0,0,0.3);
display: inline-block;
text-align: center;
border-radius: 4px;
margin: 20px 10px;
padding: 25px;
}
.related a img {
max-width: 100%;
opacity: 0.8;
}
.related a:hover img,
.related a:active img {
opacity: 1;
}
.related a h3 {
margin: 0;
padding: 0.5em 0 0.3em;
max-width: 300px;
text-align: left;
}
/* Dummy elements */
.dummy {
text-align: left;
padding: 1em;
min-height: 300px;
margin: 0 auto;
font-weight: 300;
}
.dummy-text {
max-width: 1000px;
font-size: 1.65em;
}
.info {
margin: 0 auto;
text-align: center;
max-width: 600px;
font-size: 13px;
padding: 2em 0;
}
.dummy-text p {
margin-top: 0;
line-height: 1.8;
text-align: justify;
}
.dummy-text h3 {
font-weight: 700;
text-transform: uppercase;
letter-spacing: 2px;
font-size: 1em;
margin: 2em 0 1em;
}
.dummy-menu {
max-width: 100%;
padding: 4em 1em;
}
.dummy-menu ul,
.dummy-team ul {
list-style: none;
text-align: center;
padding: 0;
margin: 0 0 3em;
}
.dummy-menu ul li {
display: inline-block;
position: relative;
margin: 0 1em;
font-size: 1.5em;
}
.dummy-menu ul li a {
display: inline-block;
font-weight: 700;
padding: 0.15em 0.25em 0;
-webkit-transition: color 0.3s;
transition: color 0.3s;
}
.dummy-menu-icons ul li {
width: 2em;
height: 2em;
font-size: 2em;
line-height: 1.75;
}
.dummy-image {
position: relative;
}
.dummy blockquote {
font-family: 'Kalam', cursive;
font-size: 2.5em;
max-width: 700px;
text-align: center;
margin: 0 auto;
}
.dummy blockquote footer {
font-size: 0.5em;
}
.dummy blockquote footer::before {
content: '—';
}
.dummy-avatar {
margin-top: 7em;
text-align: center;
}
.dummy-avatar > div {
display: inline-block;
margin: 0 1em;
}
.dummy-avatar a {
margin: 0 auto;
display: block;
text-align: center;
-webkit-transition: color 0.3s;
transition: color 0.3s;
}
.dummy-avatar a img {
border-radius: 50%;
}
.dummy-avatar a h4 {
margin: 0.25em 0;
line-height: 1;
font-size: 1.75em;
font-weight: 400;
}
@media screen and (max-width: 27em) {
.codrops-icon {
font-size: 1.5em;
}
.codrops-icon span {
display: none;
}
}
\ No newline at end of file
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block;}audio,canvas,video{display:inline-block;}audio:not([controls]){display:none;height:0;}[hidden]{display:none;}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}body{margin:0;}a:focus{outline:thin dotted;}a:active,a:hover{outline:0;}h1{font-size:2em;margin:0.67em 0;}abbr[title]{border-bottom:1px dotted;}b,strong{font-weight:bold;}dfn{font-style:italic;}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;}mark{background:#ff0;color:#000;}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em;}pre{white-space:pre-wrap;}q{quotes:"\201C" "\201D" "\2018" "\2019";}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sup{top:-0.5em;}sub{bottom:-0.25em;}img{border:0;}svg:not(:root){overflow:hidden;}figure{margin:0;}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}legend{border:0;padding:0;}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0;}button,input{line-height:normal;}button,select{text-transform:none;}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;}button[disabled],html input[disabled]{cursor:default;}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}textarea{overflow:auto;vertical-align:top;}table{border-collapse:collapse;border-spacing:0;}
\ No newline at end of file
@import url(http://fonts.googleapis.com/css?family=Gochi+Hand);
.tooltip {
position: absolute;
z-index: 999;
width: 1.em;
height: 1.em;
cursor: pointer;
}
/* Trigger item */
.tooltip-item {
width: 30px;
height: 30px;
left: 50%;
top: 50%;
margin: -15px 0 0 -15px;
position: absolute;
border-radius: 50%;
border: 2px solid #158ff6;
-webkit-animation: pulse 0.6s infinite alternate;
animation: pulse 0.6s infinite alternate;
}
@-webkit-keyframes pulse {
from { -webkit-transform: scale3d(0.5,0.5,1); }
to { -webkit-transform: scale3d(1,1,1); }
}
@keyframes pulse {
from { -webkit-transform: scale3d(0.5,0.5,1); transform: scale3d(0.5,0.5,1); }
to { -webkit-transform: scale3d(1,1,1); transform: scale3d(1,1,1); }
}
.tooltip:hover .tooltip-item {
border-color: ;
}
/*Souvenir Shop*/
.tooltip:first-child {
top: -164%;
left: 20%;
}
/*Museum TB*/
.tooltip:nth-child(2) {
top: -100%;
left: 66%;
}
/*Kolam Renang*/
.tooltip:nth-child(3) {
top: -194%;
right: 10%;
}
/*Gerbang*/
.tooltip:nth-child(4) {
top: -100%;
left: 22%;
}
/*Cafetaria*/
.tooltip:nth-child(5) {
top: -13%;
left: 40%;
}
/*Huta Batak*/
.tooltip:nth-child(6) {
top: -140%;
left: 91%;
}
/*Museum Batak*/
.tooltip:nth-child(7) {
top: -80%;
left: 90%;
}
/* Tooltip */
.tooltip-content {
position: absolute;
background: black;
z-index: 9999;
width: 600px;
height:400 px;
bottom: 100%;
margin-bottom: -1em;
padding: 20px;
border-radius: 20px;
font-size: 1.1em;
text-align: left;
color: ;
opacity: 0;
cursor: default;
pointer-events: none;
font-family: 'Gochi Hand', cursive;
-webkit-font-smoothing: antialiased;
-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
transition: opacity 0.3s, transform 0.3s;
}
.tooltip-west .tooltip-content {
left: 4em;
-webkit-transform-origin: -2em 50%;
transform-origin: -2em 50%;
-webkit-transform: translate3d(0,50%,0) rotate3d(1,1,1,30deg);
transform: translate3d(0,50%,0) rotate3d(1,1,1,30deg);
}
.tooltip-east .tooltip-content {
right: 4em;
-webkit-transform-origin: calc(100% + 2em) 50%;
transform-origin: calc(100% + 2em) 50%;
-webkit-transform: translate3d(0,50%,0) rotate3d(1,1,1,-30deg);
transform: translate3d(0,50%,0) rotate3d(1,1,1,-30deg);
}
.tooltip:hover .tooltip-content {
opacity: 1;
-webkit-transform: translate3d(0,50%,0) rotate3d(0,0,0,0);
transform: translate3d(0,50%,0) rotate3d(0,0,0,0);
pointer-events: auto;
}
/* Gap "bridge" and arrow */
.tooltip-content::before,
.tooltip-content::after {
content: '';
position: absolute;
}
.tooltip-content::before {
height: 100%;
width: 3em;
}
.tooltip-content::after {
width: 2em;
height: 2em;
top: 50%;
margin: -1em 0 0;
background: url(../img/tooltip2.svg) no-repeat center center;
background-size: 100%;
}
.tooltip-west .tooltip-content::before,
.tooltip-west .tooltip-content::after {
right: 99%; /* because of FF, otherwise we have a gap */
}
.tooltip-east .tooltip-content::before,
.tooltip-east .tooltip-content::after {
left: 99%; /* because of FF, otherwise we have a gap */
}
.tooltip-east .tooltip-content::after {
-webkit-transform: scale3d(-1,1,1);
transform: scale3d(-1,1,1);
}
.tooltip-content img {
position: relative;
height: 170px;
display: block;
float: left;
margin-right: 1em;
}
\ No newline at end of file
File added
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>
This is a custom SVG font generated by IcoMoon.
<iconset grid="14"></iconset>
</metadata>
<defs>
<font id="codropsicons" horiz-adv-x="448" >
<font-face units-per-em="448" ascent="384" descent="-64" />
<missing-glyph horiz-adv-x="448" />
<glyph unicode="&#xe001;" d="M 221.657,359.485 ,m0.00,0.00,c 0.00,0.00 -132.984-182.838 -132.205-286.236 0.515-68.522 61.089-123.688 135.314-123.218 74.202,0.479 133.943,56.421 133.428,124.943 C 357.414,178.368 221.657,359.485 221.657,359.485 z" />
<glyph unicode="&#xe004;" d="M 384.00,160.00l0.00-32.00 q0.00-13.25 -8.125-22.625t-21.125-9.375l-176.00,0.00 l 73.25-73.50q 9.50-9.00 9.50-22.50t-9.50-22.50l-18.75-19.00q-9.25-9.25 -22.50-9.25q-13.00,0.00 -22.75,9.25l-162.75,163.00q-9.25,9.25 -9.25,22.50q0.00,13.00 9.25,22.75l 162.75,162.50q 9.50,9.50 22.75,9.50q 13.00,0.00 22.50-9.50l 18.75-18.50q 9.50-9.50 9.50-22.75t-9.50-22.75l-73.25-73.25l 176.00,0.00 q 13.00,0.00 21.125-9.375 t 8.125-22.625z" horiz-adv-x="384" />
<glyph unicode="&#xe002;" d="M 407.273-23.273c0.00,0.00-325.818,0.00-366.545,0.00s-40.727,40.727-40.727,40.727l0.00,142.545 l 101.818,183.273l 244.364,0.00 l 101.818-183.273c0.00,0.00,0.00-101.818,0.00-142.545S 407.273-23.273, 407.273-23.273z M 325.818,302.545L 122.182,302.545
l-71.273-142.545L 142.545,160.00 c0.00,0.00, 40.727,0.00, 40.727-40.727l0.00-20.364 l 81.455,0.00 l0.00,20.364 c0.00,0.00,0.00,40.727, 40.727,40.727l 91.636,0.00 L 325.818,302.545z M 407.273,119.273l-96.911,0.00 C 307.532,113.917, 305.455,107.503, 305.455,98.909c0.00-40.727-40.727-40.727-40.727-40.727L 183.273,58.182 c0.00,0.00-40.727,0.00-40.727,40.727
c0.00,8.593-2.077,15.008-4.908,20.364L 40.727,119.273 l0.00-101.818 l 366.545,0.00 L 407.273,119.273 z M 132.364,221.091l 183.273,0.00 L 325.818,200.727L 122.182,200.727 L 132.364,221.091z M 152.727,261.818l 142.545,0.00 L 305.455,241.455L 142.545,241.455 L 152.727,261.818z" />
<glyph unicode="&#xe000;" d="M 368.00,144.00q0.00-13.50 -9.25-22.75l-162.75-162.75q-9.75-9.25 -22.75-9.25q-12.75,0.00 -22.50,9.25l-18.75,18.75q-9.50,9.50 -9.50,22.75t 9.50,22.75l 73.25,73.25l-176.00,0.00 q-13.00,0.00 -21.125,9.375t-8.125,22.625l0.00,32.00 q0.00,13.25 8.125,22.625t 21.125,9.375l 176.00,0.00 l-73.25,73.50q-9.50,9.00 -9.50,22.50t 9.50,22.50l 18.75,18.75q 9.50,9.50 22.50,9.50q 13.25,0.00 22.75-9.50l 162.75-162.75q 9.25-8.75 9.25-22.50z" horiz-adv-x="384" />
<glyph unicode="&#xe003;" d="M 224.00-64.00C 100.291-64.00,0.00,36.291,0.00,160.00S 100.291,384.00, 224.00,384.00s 224.00-100.291, 224.00-224.00S 347.709-64.00, 224.00-64.00z
M 224.00,343.273c-101.228,0.00-183.273-82.045-183.273-183.273s 82.045-183.273, 183.273-183.273s 183.273,82.045, 183.273,183.273S 325.228,343.273, 224.00,343.273z M 244.364,122.164C 244.364,111.005, 244.364,98.909, 244.364,98.909l-40.727,0.00 c0.00,0.00,0.00,29.466,0.00,40.727
s 9.123,20.364, 20.364,20.364l0.00,0.00c 22.481,0.00, 40.727,18.246, 40.727,40.727s-18.246,40.727-40.727,40.727S 183.273,223.209, 183.273,200.727c0.00-7.453, 2.138-14.356, 5.641-20.364L 145.437,180.364 C 143.727,186.90, 142.545,193.661, 142.545,200.727
c0.00,44.983, 36.471,81.455, 81.455,81.455s 81.455-36.471, 81.455-81.455C 305.455,162.831, 279.45,131.247, 244.364,122.164z M 244.364,37.818l-40.727,0.00 l0.00,40.727 l 40.727,0.00 L 244.364,37.818 z" />
<glyph unicode="&#x20;" horiz-adv-x="224" />
<glyph class="hidden" unicode="&#xf000;" d="M0,384L 448 -64L0 -64 z" horiz-adv-x="0" />
</font></defs></svg>
\ No newline at end of file
Icon Set: Font Awesome -- http://fortawesome.github.com/Font-Awesome/
License: SIL -- http://scripts.sil.org/cms/scripts/page.php?site_id=nrsi&id=OFL
Icon Set: Eco Ico -- http://dribbble.com/shots/665585-Eco-Ico
License: CC0 -- http://creativecommons.org/publicdomain/zero/1.0/
\ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
denahlokasi/img/batak.jpg

39.7 KB

denahlokasi/img/cafe.jpg

10.2 KB

denahlokasi/img/gerbang.jpg

9.61 KB

denahlokasi/img/hutabatak.jpg

8.72 KB

denahlokasi/img/kolam.jpg

10.9 KB

denahlokasi/img/map.jpg

642 KB

denahlokasi/img/map_2_2_2.jpg

1010 KB

denahlokasi/img/souvenir.jpg

10.1 KB

denahlokasi/img/tb.jpg

141 KB

<?php session_start();
if(isset($_SESSION['username'])){
//koneksi terpusat
include "config/koneksi.php";
$username=$_SESSION['username'];
if(isset($_POST['Edit']))
{
mysql_query("UPDATE tbl_user SET nama_user='$_POST[nama]', no_hp='$_POST[no_hp]', no_rek='$_POST[no_rek]', nama_rek='$_POST[nama_rek]', tgl_lahir='$_POST[tgl_lahir]', jekel='$_POST[jekel]', alamat='$_POST[alamat]', email_user='$_POST[email]', tipe_id='$_POST[tipe_id]', no_id='$_POST[no_id]' WHERE id_user= '$_POST[id_user]'");
header('location:profil.php');
}
?>
<!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>Edit Profil</title>
</head>
<body class="metro">
<header class="bg-darkCobalt" data-load="atasan.php"></header>
<div class="" data-load="sampul.html"></div>
<script type="text/javascript" src="admin/tinymce/tinymce.min.js"></script>
<script type="text/javascript">
tinymce.init({
selector: "textarea",
toolbar1: "undo redo | cut copy paste | bold italic underline strikethrough | alignleft aligncenter alignright alignjustify",
menubar: false,
toolbar_items_size: 'small',
});</script>
<?php
$query =mysql_query("SELECT * FROM tbl_user WHERE username='$username'");
$tampil =mysql_fetch_array($query);
?>
<!-- ---------------------------------------- ISI TAB ------------------------------------- -->
<div class="container">
<div class="grid">
<form name="editProfil" method="post" action="#">
<div class="row">
<div class="span6">
<fieldset>
<legend class="text-right">Edit</legend>
<lable>Nama Lengkap</lable>
<div class="input-control text" data-role="input-control">
<input type="hidden" name="id_user" readonly
value="<?php echo $tampil['id_user'];?>">
<input type="text" name="nama"
value="<?php echo $tampil['nama_user'];?>">
<button class="btn-clear" tabindex="-1"></button>
</div>
<lable>Nomor Handphone</lable>
<div class="input-control text" data-role="input-control">
<input type="text" name="no_hp"
value="<?php echo $tampil['no_hp'];?>">
<button class="btn-clear" tabindex="-1"></button>
</div>
<lable>Tanggal Lahir</lable>
<div class="input-control text" data-role="input-control">
<div class="input-control text" data-role="datepicker" data-format="dd mmmm yyyy" data-effect="fade">
<input type="text" name="tgl_lahir"
value="<?php echo $tampil['tgl_lahir'];?>">
<span class="btn-date"></span>
</div>
</div>
<lable>Jenis Kelamin</lable>
<div>
<?php
if($tampil['jekel']=='L'){
$l= "checked"; $p="";
}else if($tampil['jekel']=='P'){
$l= ""; $p="checked";
}else{
$l= ""; $p="";
}
?>
<div class="input-control radio" data-role="input-control">
<label>
<input type="radio" name="jekel" value="L" <?php echo $l ?> />
<span class="check"></span>
Laki-laki
</label>
</div>
<div class="input-control radio" data-role="input-control">
<label>
<input type="radio" name="jekel" value="P" <?php echo $p ?> />
<span class="check"></span>
Perempuan
</label>
</div>
</div>
<lable>Nomor Rekening</lable>
<div class="input-control text" data-role="input-control">
<input type="text" name="no_rek"
value="<?php echo $tampil['no_rek'];?>">
<button class="btn-clear" tabindex="-1"></button>
</div>
<lable>Atas Nama Rekening</lable>
<div class="input-control text" data-role="input-control">
<input type="text" name="nama_rek"
value="<?php echo $tampil['nama_rek'];?>">
<button class="btn-clear" tabindex="-1"></button>
</div>
<label>Alamat</label>
<div class="input-control textarea" data-role="input-control">
<textarea name="alamat" rows="2"><?php echo $tampil['alamat']; ?></textarea>
</div>
</fieldset>
</div>
<div class="span6">
<fieldset>
<legend>Profil</legend>
<lable>Email</lable>
<div class="input-control text" data-role="input-control">
<input type="text" name="email"
value="<?php echo $tampil['email_user'];?>">
<button class="btn-clear" tabindex="-1"></button>
</div>
<lable>Tipe Identitas</lable>
<div class="input-control select" data-role="input-control">
<select name="tipe_id">
<?php
for($i=1; $i<=4; $i++){
if($i==1){
$value="KTP";
}else if($i==2){
$value="SIM";
}else if($i==3){
$value="Pasport";
}else if($i==4){
$value="Kartu Pelajar";
}
if($tampil['tipe_id']==$value){
$sel= "selected";
}else{
$sel= "";
}
echo "<option value='$value' $sel>$value</option>";
}?>
</select>
</div>
<lable>Nomor Identitas</lable>
<div class="input-control text" data-role="input-control">
<input type="text" name="no_id"
value="<?php echo $tampil['no_id'];?>">
<button class="btn-clear" tabindex="-1"></button>
</div>
</fieldset>
</div>
</div>
<input type="submit" name="Edit" value="Simpan Perubahan">
</form>
</div>
</div>
<!-- ---------------------------------------- ISI TAB ------------------------------------- -->
<footer class="dark" data-load="bawahan.html"></footer>
</body>
</html>
<?php
}else{
session_destroy();
header('Location:formRegistrasi.php?status=Silahkan Login');
}
?>
\ No newline at end of file
File added
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>
This is a custom SVG font generated by IcoMoon.
<iconset grid="14"></iconset>
</metadata>
<defs>
<font id="codropsicons" horiz-adv-x="448" >
<font-face units-per-em="448" ascent="384" descent="-64" />
<missing-glyph horiz-adv-x="448" />
<glyph unicode="&#xe001;" d="M 221.657,359.485 ,m0.00,0.00,c 0.00,0.00 -132.984-182.838 -132.205-286.236 0.515-68.522 61.089-123.688 135.314-123.218 74.202,0.479 133.943,56.421 133.428,124.943 C 357.414,178.368 221.657,359.485 221.657,359.485 z" />
<glyph unicode="&#xe004;" d="M 384.00,160.00l0.00-32.00 q0.00-13.25 -8.125-22.625t-21.125-9.375l-176.00,0.00 l 73.25-73.50q 9.50-9.00 9.50-22.50t-9.50-22.50l-18.75-19.00q-9.25-9.25 -22.50-9.25q-13.00,0.00 -22.75,9.25l-162.75,163.00q-9.25,9.25 -9.25,22.50q0.00,13.00 9.25,22.75l 162.75,162.50q 9.50,9.50 22.75,9.50q 13.00,0.00 22.50-9.50l 18.75-18.50q 9.50-9.50 9.50-22.75t-9.50-22.75l-73.25-73.25l 176.00,0.00 q 13.00,0.00 21.125-9.375 t 8.125-22.625z" horiz-adv-x="384" />
<glyph unicode="&#xe002;" d="M 407.273-23.273c0.00,0.00-325.818,0.00-366.545,0.00s-40.727,40.727-40.727,40.727l0.00,142.545 l 101.818,183.273l 244.364,0.00 l 101.818-183.273c0.00,0.00,0.00-101.818,0.00-142.545S 407.273-23.273, 407.273-23.273z M 325.818,302.545L 122.182,302.545
l-71.273-142.545L 142.545,160.00 c0.00,0.00, 40.727,0.00, 40.727-40.727l0.00-20.364 l 81.455,0.00 l0.00,20.364 c0.00,0.00,0.00,40.727, 40.727,40.727l 91.636,0.00 L 325.818,302.545z M 407.273,119.273l-96.911,0.00 C 307.532,113.917, 305.455,107.503, 305.455,98.909c0.00-40.727-40.727-40.727-40.727-40.727L 183.273,58.182 c0.00,0.00-40.727,0.00-40.727,40.727
c0.00,8.593-2.077,15.008-4.908,20.364L 40.727,119.273 l0.00-101.818 l 366.545,0.00 L 407.273,119.273 z M 132.364,221.091l 183.273,0.00 L 325.818,200.727L 122.182,200.727 L 132.364,221.091z M 152.727,261.818l 142.545,0.00 L 305.455,241.455L 142.545,241.455 L 152.727,261.818z" />
<glyph unicode="&#xe000;" d="M 368.00,144.00q0.00-13.50 -9.25-22.75l-162.75-162.75q-9.75-9.25 -22.75-9.25q-12.75,0.00 -22.50,9.25l-18.75,18.75q-9.50,9.50 -9.50,22.75t 9.50,22.75l 73.25,73.25l-176.00,0.00 q-13.00,0.00 -21.125,9.375t-8.125,22.625l0.00,32.00 q0.00,13.25 8.125,22.625t 21.125,9.375l 176.00,0.00 l-73.25,73.50q-9.50,9.00 -9.50,22.50t 9.50,22.50l 18.75,18.75q 9.50,9.50 22.50,9.50q 13.25,0.00 22.75-9.50l 162.75-162.75q 9.25-8.75 9.25-22.50z" horiz-adv-x="384" />
<glyph unicode="&#xe003;" d="M 224.00-64.00C 100.291-64.00,0.00,36.291,0.00,160.00S 100.291,384.00, 224.00,384.00s 224.00-100.291, 224.00-224.00S 347.709-64.00, 224.00-64.00z
M 224.00,343.273c-101.228,0.00-183.273-82.045-183.273-183.273s 82.045-183.273, 183.273-183.273s 183.273,82.045, 183.273,183.273S 325.228,343.273, 224.00,343.273z M 244.364,122.164C 244.364,111.005, 244.364,98.909, 244.364,98.909l-40.727,0.00 c0.00,0.00,0.00,29.466,0.00,40.727
s 9.123,20.364, 20.364,20.364l0.00,0.00c 22.481,0.00, 40.727,18.246, 40.727,40.727s-18.246,40.727-40.727,40.727S 183.273,223.209, 183.273,200.727c0.00-7.453, 2.138-14.356, 5.641-20.364L 145.437,180.364 C 143.727,186.90, 142.545,193.661, 142.545,200.727
c0.00,44.983, 36.471,81.455, 81.455,81.455s 81.455-36.471, 81.455-81.455C 305.455,162.831, 279.45,131.247, 244.364,122.164z M 244.364,37.818l-40.727,0.00 l0.00,40.727 l 40.727,0.00 L 244.364,37.818 z" />
<glyph unicode="&#x20;" horiz-adv-x="224" />
<glyph class="hidden" unicode="&#xf000;" d="M0,384L 448 -64L0 -64 z" horiz-adv-x="0" />
</font></defs></svg>
\ No newline at end of file
Icon Set: Font Awesome -- http://fortawesome.github.com/Font-Awesome/
License: SIL -- http://scripts.sil.org/cms/scripts/page.php?site_id=nrsi&id=OFL
Icon Set: Eco Ico -- http://dribbble.com/shots/665585-Eco-Ico
License: CC0 -- http://creativecommons.org/publicdomain/zero/1.0/
\ No newline at end of file
File added
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
File added
This source diff could not be displayed because it is too large. You can view the blob instead.
This source diff could not be displayed because it is too large. You can view the blob instead.
File added
File added
File added
File added
<!--
author: W3layouts
author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
-->
<!DOCTYPE html>
<html>
<head>
<title>TB SILALAHI CENTER</title>
<link href="footer/css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
<link href="footer/css/style.css" rel="stylesheet" type="text/css" media="all" />
<!--icon panah-->
<link href="footer/css/font-awesome.css" rel="stylesheet">
<script src="footer/js/jquery-1.11.1.min.js"></script>
<!--/icon panah-->
</head>
<body>
<!--footer-->
<div class="footer">
<div class="container">
<div class="w3_footer_grids">
<div class="col-md-3 w3_footer_grid">
<h3>Contact</h3>
<ul class="address">
<li><i class="glyphicon glyphicon-map-marker" aria-hidden="true"></i>TB SILALAHI CENTER<span>BALIGE</span></li>
<li><i class="glyphicon glyphicon-envelope" aria-hidden="true"></i><a href="mailto:info@example.com">www.tbs.ac.id</a></li>
<li><i class="glyphicon glyphicon-earphone" aria-hidden="true"></i>082294686974</li>
<li><i class="glyphicon glyphicon-earphone" aria-hidden="true"></i>081370594887</li>
</ul>
</div>
<div class="col-md-3 w3_footer_grid">
<h3>Information</h3>
<ul class="info">
<li><i class="fa fa-arrow-right" aria-hidden="true"></i><a href="about.html">About Us</a></li>
<li><i class="fa fa-arrow-right" aria-hidden="true"></i><a href="contact.html">Contact Us</a></li>
<li><i class="fa fa-arrow-right" aria-hidden="true"></i><a href="faq.html">FAQ's</a></li>
<li><i class="fa fa-arrow-right" aria-hidden="true"></i><a href="faq.html">Location</a></li>
</ul>
</div>
<div class="col-md-3 w3_footer_grid">
<h3>Category</h3>
<ul class="info">
<li><i class="fa fa-arrow-right" aria-hidden="true"></i><a href="groceries.html">Galery</a></li>
<li><i class="fa fa-arrow-right" aria-hidden="true"></i><a href="household.html">Sejarah</a></li>
</ul>
</div>
<div class="clearfix"> </div>
</div>
</div>
<div class="footer-copy">
<div class="container">
<p>© 2017 Information | TB SILALAHI CENTER <a href="http://www.tbs.ac.id/">Our Web</a></p>
</div>
</div>
</div>
<!-- //footer -->
</script>
</body>
</html>
\ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
<!--
author: W3layouts
author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
-->
<!DOCTYPE html>
<html>
<head>
<title>TB SILALAHI CENTER</title>
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<!--icon panah-->
<link href="css/font-awesome.css" rel="stylesheet">
<script src="js/jquery-1.11.1.min.js"></script>
<!--/icon panah-->
</head>
<body>
<!--footer-->
<div class="footer">
<div class="container">
<div class="w3_footer_grids">
<div class="col-md-3 w3_footer_grid">
<h3>Contact</h3>
<ul class="address">
<li><i class="glyphicon glyphicon-map-marker" aria-hidden="true"></i>TB SILALAHI CENTER<span>BALIGE</span></li>
<li><i class="glyphicon glyphicon-envelope" aria-hidden="true"></i><a href="mailto:info@example.com">www.tbs.ac.id</a></li>
<li><i class="glyphicon glyphicon-earphone" aria-hidden="true"></i>082294686974</li>
<li><i class="glyphicon glyphicon-earphone" aria-hidden="true"></i>081370594887</li>
</ul>
</div>
<div class="col-md-3 w3_footer_grid">
<h3>Information</h3>
<ul class="info">
<li><i class="fa fa-arrow-right" aria-hidden="true"></i><a href="about.html">About Us</a></li>
<li><i class="fa fa-arrow-right" aria-hidden="true"></i><a href="contact.html">Contact Us</a></li>
<li><i class="fa fa-arrow-right" aria-hidden="true"></i><a href="faq.html">FAQ's</a></li>
<li><i class="fa fa-arrow-right" aria-hidden="true"></i><a href="faq.html">Location</a></li>
</ul>
</div>
<div class="col-md-3 w3_footer_grid">
<h3>Category</h3>
<ul class="info">
<li><i class="fa fa-arrow-right" aria-hidden="true"></i><a href="groceries.html">Galery</a></li>
<li><i class="fa fa-arrow-right" aria-hidden="true"></i><a href="household.html">Sejarah</a></li>
</ul>
</div>
<div class="clearfix"> </div>
</div>
</div>
<div class="footer-copy">
<div class="container">
<p>© 2017 Information | TB SILALAHI CENTER <a href="http://www.tbs.ac.id/">Our Web</a></p>
</div>
</div>
</div>
<!-- //footer -->
</script>
</body>
</html>
\ No newline at end of file
<!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>Selamat Datang di Website Kami</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>
image/Naniura.jpg

10.3 KB

image/Pakaianpakpak.jpg

20.5 KB

image/bpk.jpg

44.3 KB

image/gule.jpg

2.89 KB

image/makananangkola.jpg

142 KB

image/pakaianangkola.jpg

17.3 KB

image/pakaiankaro.jpg

23.5 KB

image/pakaianmandailing.jpg

23.3 KB

image/pakaiantoba.jpg

2.61 KB

image/peleng.jpg

2.35 KB

image/rumahangkola.jpg

6.35 KB

image/rumahkaro.jpg

50.4 KB

This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.
This diff is collapsed. Click to expand it.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment