%PDF-
%PDF-
Mini Shell
Mini Shell
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>Boniface Tours & Travels</title>
<!-- Bootstrap -->
<link href="<?php echo base_url().'assets/';?>css/bootstrap.min.css" rel="stylesheet">
<link href="<?php echo base_url().'assets/';?>css/main.css" rel="stylesheet">
<!-- Style CSS -->
<link href="<?php echo base_url().'assets/';?>css/style2.css" rel="stylesheet">
<!-- Google Fonts -->
<link href="<?php echo base_url().'assets/';?>https://fonts.googleapis.com/css?family=Rubik:300,300i,400,400i,500,500i,700,700i,900,900i" rel="stylesheet">
<!-- FontAwesome icon -->
<link href="<?php echo base_url().'assets/';?>fontawesome/css/fontawesome-all.css" rel="stylesheet">
<!-- Fontello icon -->
<link href="<?php echo base_url().'assets/';?>fontello/css/fontello.css" rel="stylesheet">
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<style>
.venue-pageheader {
background: url(../../Admin/assets/uploads/<?=$details['main_image']?>) no-repeat center;
background-size: auto;
background-size: cover;
}
.venue-pageheader h3{
font-size: 26px;
font-weight: bold;
color: #fff;
}
ul.tabs{
margin: 0px;
padding: 0px;
list-style: none;
}
ul.tabs li{
background: none;
color: #222;
display: inline-block;
padding: 10px 15px;
cursor: pointer;
font-size: 14px;
font-weight: bold;
}
ul.tabs li.current{
background: #fff;
color: #222;
border-bottom: 3px solid #ffb70b;
}
.tab-content{
display: none;
background: #fff;
padding: 15px;
}
.tab-content.current{
display: inherit;
}
/* media query */
@media screen and (max-width:360px){
.tabs{
margin:0;
width:96%;
}
.tabs .tabs-list li{
width:80px;
}
}
.blockcard{
border: 1px solid #eae2e2;
box-shadow: 0 4px 8px 0 rgba(138, 107, 118, 0.08);
padding: 10px;
min-height: 160px;
margin-top: 3%;
padding: 5px;
}
.blockcard h2{
font-size: 17px;
font-weight: bold;
}
.blockcard p{
font-size: 14px !important;
font-family: lato !important;
}
.blockcard h3{
font-size: 17px;
font-weight: bold;
}
</style>
</head>
<body>
<!-- header-top -->
<!--/.header-top -->
<!-- header -->
<?php include ('test.php');?>
<!-- /.header -->
<!-- page-header -->
<div class="venue-pageheader">
<div class="page-section">
<div class="container">
<div class="row">
<!-- page section -->
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
<h3><?=$details['package_name']?></h3>/
<a href="#" class="btn btn-default" id="open-popup"><?=$details['package_name']?></a>
</div>
</div>
</div>
</div>
</div>
<!-- /.page-header -->
<!-- page-header -->
<div class="bg-white">
<div class="container">
<div class="row">
<div class="col-md-8">
<div class="container">
<ul class="tabs">
<li class="tab-link current" data-tab="tab-1">Day Plan</li>
<li class="tab-link" data-tab="tab-2">Hotels</li>
<li class="tab-link" data-tab="tab-3">Flights</li>
<li class="tab-link" data-tab="tab-4">Inclusions / Exclusions</li>
<li class="tab-link" data-tab="tab-5">Policies</li>
</ul>
<div id="tab-1" class="tab-content current">
<?php foreach ($planner as $plan) { ?>
<div class="row blockcard">
<div class="col-md-4">
<img src="<?php echo base_url().'Admin/assets/uploads';?>/<?=$plan['image_name']?>">
</div>
<div class="col-md-8">
<h3><?=$plan['day']?></h3>
<p><?=$plan['description']?></p>
</div>
</div>
<?php } ?>
</div>
<div id="tab-2" class="tab-content">
<?php foreach ($hotels as $hotel) { ?>
<div class="row blockcard">
<div class="col-md-4">
<img src="<?php echo base_url().'Admin/assets/uploads';?>/<?=$hotel['image_name']?>">
</div>
<div class="col-md-8">
<h2><?=$hotel['hotel_name']?></h2>
<h3><?=$hotel['type']?></h3>
<h3><?=$hotel['city']?></h3>
</div>
</div>
<?php } ?>
</div>
<div id="tab-3" class="tab-content">
<H2>Flights</H2>/
</div>
<div id="tab-4" class="tab-content">
<?=$details['policies']?>
</div>
<div id="tab-5" class="tab-content">
<?=$details['terms']?>
</div>
</div><!-- container -->
</div>
<div class="col-md-4">
<div class="sidebar-venue">
<div class="well-box-dark">
<h2>Rs <?=$details['price']?></h2>
<form>
<div class="row">
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
<h3 class="mb30">Book Now</h3>
</div>
<!-- Text input-->
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
<div class="form-group">
<label class="control-label sr-only" for="name">Name</label>
<input id="name" name="name" type="text" placeholder="Name" class="form-control input-md" required="">
</div>
</div>
<!-- Text input-->
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
<div class="form-group">
<label class=" control-label sr-only" for="email">Email</label>
<input id="email" name="email" type="text" placeholder="Email" class="form-control input-md" required="">
</div>
</div>
<!-- Text input-->
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
<div class="form-group">
<label class=" control-label sr-only" for="phone">Phone</label>
<input id="phone" name="phone" type="text" placeholder="Phone" class="form-control input-md" required="">
</div>
</div>
<!-- Text input-->
<!-- Textarea -->
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
<div class="form-group">
<label class="control-label sr-only" for="comments">Comment</label>
<textarea class="form-control" id="comments" name="comments" rows="5" placeholder="Write Comment"></textarea>
</div>
</div>
<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
<div class="form-group">
<button type="submit" class="btn btn-default btn-block buttonsearch">Book Now</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /.tiny-footer-section -->
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script type="text/javascript">
$(document).ready(function(){
$('ul.tabs li').click(function(){
var tab_id = $(this).attr('data-tab');
$('ul.tabs li').removeClass('current');
$('.tab-content').removeClass('current');
$(this).addClass('current');
$("#"+tab_id).addClass('current');
})
})
</script>
</body>
</html>
Zerion Mini Shell 1.0