%PDF- %PDF-
Mini Shell

Mini Shell

Direktori : /home/ugotscom/3vfm3/resources/views/
Upload File :
Create Path :
Current File : /home/ugotscom/3vfm3/resources/views/home3.blade.php

<!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, shrink-to-fit=no">
  <meta name="description" content="">
  <meta name="author" content="">

  <title>Karetakers</title>

  <!-- Custom fonts for this template-->
  <link href="vendor/fontawesome-free/css/all.min.css" rel="stylesheet" type="text/css">
  <link href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">
  <!-- Custom styles for this template-->

<link rel="stylesheet" href="/css/app.css">
<link href="assets/css/style.css" rel="stylesheet">
<link href="assets/lib/bootstrap/css/bootstrap.min.css" rel="stylesheet">

<!-- Libraries CSS Files -->
<link href="assets/lib/font-awesome/css/font-awesome.min.css" rel="stylesheet">
<link href="assets/lib/animate/animate.min.css" rel="stylesheet">
<link href="assets/lib/ionicons/css/ionicons.min.css" rel="stylesheet">
<link href="assets/lib/owlcarousel/assets/owl.carousel.min.css" rel="stylesheet">
<link href="assets/lib/lightbox/css/lightbox.min.css" rel="stylesheet">

<!-- Main Stylesheet File -->
<style>
* { box-sizing: border-box; }
.full{
width: 100%;

margin-right: auto;
margin-left: auto;

}
.owl-prev .owl-next{
  display:none;
}

.wrapper {
  max-width: 60rem;
  width: 100%;
  margin: 150px auto;
}

.tabs {
  position: relative;
  margin: 3rem 0;
  background: #fff;
  height: 9.75rem;;
opacity: 0.9;
}

.tabs::before,
.tabs::after {
  content: "";
  display: table;
}

.tabs::after { clear: both; }

.tab { float: left; }

.tab-switch { display: none; }

.tab-label {
  position: relative;
  display: block;
  line-height: 2.75em;
  height: 3em;
  padding: 0 1.618em;
  background: #fff;
  border-right: 0.125rem solid #eaeeee;
  color: #000;
  cursor: pointer;
  top: 0;
  transition: all 0.25s;
}

.tab-label:hover {
  top: -0.25rem;
  transition: all 0.25s;
}

.tab-content {
  padding: 1.618rem;
  background: #fff;
  color: #2c3e50;
  height: 7rem;
  position: absolute;
  z-index: 1;
  top: 2.75em;
  left: 0;
  opacity: 0;
  transition: all 0.35s;
  border-top: 1px solid #eaeeee;
}

.tab-switch:checked + .tab-label {
  background: #ffc30f;
  color: #2c3e50;
  border-bottom: 0;
  border-right: 0.0625rem solid #fff;
  transition: all 0.35s;
  z-index: 2;
  top: -0.0625rem;
}

.tab-switch:checked + .tab-label:hover { top: -0.0625rem; }

.tab-switch:checked + .tab-label + .tab-content {
  opacity: 1;
  transition: all 0.35s;
  z-index: 3;
}
.soverlay{
padding: 10px;
font-family: Arial;
z-index: 990;
margin: auto;
width: 80%;
position: absolute;
top: 4%;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}
.form-inline label{
justify-content: left;
}
.input_wrapper {

    padding-right: 20px;

}
.input_wrapper label{
  color:#999;
font-weight: 400;
display: block;
font-size: 14px;
font-family: Rubik,sans-serif;
}
.form-inline button{
min-width: 110px;
height: 40px;
padding: 0 15px;
background:#ffc30f;;
white-space: nowrap;
border-radius: 3px;
font-size: 16px;
color:#000;
transition: all .2s ease-out, color .2s ease-out;
border: 0;
cursor: pointer;
font-weight: 400;
font-family: 'Poppins', sans-serif;
margin-left: 10px;
}
.input_wrapper input{
border:0;
outline: 0;
border-bottom: 1px solid #e0e0e1;
width: 157px;
}
.slantedDivA{
      position: relative;
      width: 100%;
      height: auto;
      background: rgba(40, 40, 40, 1);
      box-sizing: border-box;
      padding: 30px;
      color: #fff;
      margin-bottom: 200px;
    }

    .slantedDivA:after{
      position: absolute;
      width: 100%;
      height: 100%;
      content: '';
      background: inherit;
      z-index: -1;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      transform-origin: top left;
      transform: skewY(4deg);
    }
    .carousel-indicators{
      display:none;
    }
    .ui-widget.ui-widget-content {
    border: 1px solid #d3d3d3;
    z-index: 9999;
}
#owl-one h4{
  font-size:15px;
  font-weight: bold;
  padding-top: 10px;
}

.vertical-menu {
    width: 60px;
    position: fixed;
    z-index: 5;
    right: 0;
    margin-top: 15%;
}
.vertical-menu a {
   
    display: block;
    padding-top: 8px;
    padding-bottom: 8px;
    text-decoration: none;
    text-align: center;
    font-size: 12px;
}
.call{
  background-color: #f9c11e;
    color: #fff; 
}

    .scroll-top{
        position: fixed;
        bottom: 10px;
        right: 10px;
        z-index: 99;
        background: red;
        color: #fff;
        border-radius: 30px;
        padding: 15px;
        font-weight: bold;
        line-height: normal;
        border: none;
    }
    .actived{

      display:none;
    }
    .facebook {
  background: #3B5998;
  color: white;
}

.youtube {
  background: #bb0000;
  color: white;
}
.instagram{
   background: linear-gradient(45deg,#405DE6,#5851DB,#833AB4,#C13584,#E1306C,#Fd1d1d);
   color:#fff;
}
.banner{
position:relative;
width:100%;
height:100vh;
background:url('assets/img/bg.jpg');
background-size:cover;
background-position:bottom;
display:flex;
justify-content:center;
align-items:center;
}

.banner #text{
position:relative;
font-size:12em;
color:#fff;
}

.banner .clouds {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
overflow:hidden;
pointer-events:none;
}

.banner .clouds img{

position:absolute;
bottom:0;
max-width:100%;
animation: animate calc(3s * var(--i)) linear infinite;
}

@keyframes animate
{
  0%
  {
    opacity:0;
    transform:scale(1);
  } 
  25%,75%
  {
   opacity:1;
  }
  100%
  {
opacity:0;
  transform:scale(3);
  }
}
.container-fluid-masonry {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
}
.m-image{
  padding-top: 10px;
}
.container-fluid-masonry img {
  width: 100%;
  height: auto;
  transition: all .2s ease-in-out;
}
.container-fluid-masonry img:hover {
transform: scale(0.97);
}
.container-fluid-masonry .col-md-4 {
 padding-right: 0px;
}
.destinations{
  padding-top: 8%;
  padding-bottom: 8%;
  text-align: center;
}
.destinations h2{
 text-align: center;
font-weight: 800;
font-size: 2em;
color: #013147;
}
.check_box input[type="checkbox"] 
{ 
    margin-right: 50px; 
}
#yourdiv{
  padding-top: 2%;
}
#yourdiv2{
  padding-top: 2%;
}
.check_box{
  font-size: 16px;
}
.destinations input {
    margin: 5px;
}
</style>
</head>

<body id="page-top">
<div class="" id="app">

<header id="header">
    <div class="container-fluid">

      <div id="logo" class="pull-left">
      
        <img src="assets/img/logo.png">
       </div>

      <nav id="nav-menu-container">
        <ul class="nav-menu">
          <li class="menu-active"><a href="#intro">Home</a></li>
          <li><a href="#about">About Us</a></li>
          <li><a href="#services">Tour Packages</a>
              <ul>
              <li><a href="#">International Packages</a></li>
              <li><a href="#">Domestic Packages</a></li>
              </ul>

          </li>
          <li><a href="#portfolio">Blog</a></li>
          <li><a href="#team">Contact Us</a></li>
    
        </ul>
      </nav><!-- #nav-menu-container -->
    </div>
  </header><!-- #header -->
  <div class="vertical-menu">
            
      <a href="#" class="active call" onmouseover="openNav()" data-toggle="modal" data-target="#myModal"> <i class="fa fa-phone" style="font-size:30px;padding-bottom: 10%;"></i><br></a>
      <a href="#" class="active facebook" > <i class="fa fa-facebook" style="font-size:30px;padding-bottom: 10%;"></i><br></a>
      <a href="#" class="active instagram" > <i class="fa fa-instagram" style="font-size:30px;padding-bottom: 10%;"></i><br></a>
      <a href="#" class="active youtube" > <i class="fa fa-youtube" style="font-size:30px;padding-bottom: 10%;"></i><br></a>
 </div>
 
 <button type="button" class="scroll-top">Go to Top</button>    

 <section id="intro">
    <div class="intro-container">
      <div class="soverlay">
         <div class="wrapper">
         <example-component></example-component>
  
      </div>
      
    </div>
   </div>

      <div id="introCarousel" class="carousel  slide carousel-fade" data-ride="carousel">

        <ol class="carousel-indicators"></ol>

        <div class="carousel-inner" role="listbox">

          <div class="carousel-item active">
            <div class="carousel-background"><img src="assets/img/intro-carousel/3.jpg" alt=""></div>
            <div class="carousel-container">
              <div class="carousel-content">
             
              </div>
            </div>
          </div>

          <div class="carousel-item">
            <div class="carousel-background"><img src="assets/img/intro-carousel/7.jpg" alt=""></div>
            <div class="carousel-container">
              <div class="carousel-content">
           
              </div>
            </div>
          </div>

          <div class="carousel-item">
            <div class="carousel-background"><img src="assets/intro-carousel/1.jpg" alt=""></div>
            <div class="carousel-container">
              <div class="carousel-content">
               
              </div>
            </div>
          </div>

       <div class="carousel-item">
            <div class="carousel-background"><img src="assets/img/intro-carousel/8.jpg" alt=""></div>
            <div class="carousel-container">
              <div class="carousel-content">
               
              </div>
            </div>
          </div>

        </div>

        <a class="carousel-control-prev" href="" role="button" data-slide="prev">
          <span class="carousel-control-prev-icon ion-chevron-left" aria-hidden="true"></span>
          <span class="sr-only">Previous</span>
        </a>

        <a class="carousel-control-next" href="" role="button" data-slide="next">
          <span class="carousel-control-next-icon ion-chevron-right" aria-hidden="true"></span>
          <span class="sr-only">Next</span>
        </a>

      </div>
    </div>
  </section><!-- #intro -->
  <div class="balloon"><img src="assets/img/balloon.png"></div>
    <!--==========================
      Featured Services Section
    ============================-->
<section id="offers">
<div class="container">
        <div class="row">
<div class="col-lg-12 box">
  <header class="section-header">
    <br>
          <h3>Special Offers</h3>
         </header>
         @{{ message }}
    <div class="owl-carousel owl-theme" id="owl-one">
      
      <div class="item"><a href=""><img src="" class="img-respopnsive"></a><h4></h4></div>

</div>




</div>

</div>
</div>
</section>

    <section id="featured-services">
      <div class="container">
        <div class="row">
          <div class="col-md-6">
     
          <h3>Our Services</h3>
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum</p>
      <br>
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex </p>
          </div>
            <div class="col-md-6">
<div class="row">
<div class="col-md-3">
 <img src="assets/img/services/1.png">
 <h4>Medical Tourism</h4>
</div>
<div class="col-md-3">
 <img src="assets/img/services/2.png">
 <h4>Hotel Booking</h4>
</div>
<div class="col-md-3">
  <img src="assets/img/services/3.png">
  <h4>Bus Booking</h4>
</div>
<div class="col-md-3">
  <img src="assets/img/services/4.png">
  <h4>Passport Renewal</h4>
</div>
</div>
<div class="row">
<div class="col-md-3">
 <img src="assets/img/services/5.png">
 <h4>Train Booking</h4>
</div>
<div class="col-md-3">
 <img src="assets/img/services/6.png">
  <h4>Houseboat Booking</h4>
</div>
<div class="col-md-3">
  <img src="assets/img/services/8.png">
   <h4>Holiday Booking</h4>
</div>
<div class="col-md-3">
  <img src="assets/img/services/9.png">
   <h4>Flight Booking</h4>
</div>
</div>
          </div>


        </div>
      </div>
    </section><!-- #featured-services -->

    <!--==========================
      About Us Section
    ============================-->

    <!--==========================
      Services Section
    ============================-->
   
   
   


    <!--==========================
      Clients Section
    ============================-->
<div class="banner">
  <h2 id="text">EXPLORE</h2>
  <div class="clouds">
    <img src="assets/img/cloud1.png" style="--i:1;">
    <img src="assets/img/cloud2.png" style="--i:2;">
    <img src="assets/img/cloud3.png" style="--i:3;">
    <img src="assets/img/cloud4.png" style="--i:4;">
    <img src="assets/img/cloud5.png" style="--i:5;">
    <img src="assets/img/cloud1.png" style="--i:10;">
    <img src="assets/img/cloud2.png" style="--i:9;">
    <img src="assets/img/cloud3.png" style="--i:8;">
    <img src="assets/img/cloud4.png" style="--i:7;">
    <img src="assets/img/cloud5.png" style="--i:6;">
  </div>

</div>
  <img src="assets/img/ad-strip.jpg" alt="" class="img-responsive">

<section>
  <div class="container-fluid-masonry">
    <div class="row ">
  
    </div>
    <div class="row">
      <div class="col-md-4">
          <img src="assets/img/masonry/1.jpg" alt="" class="img-responsive">
 <img src="assets/img/masonry/2.jpg" alt="" class="img-responsive m-image">
      </div>
          <div class="col-md-4">
          <img src="assets/img/masonry/3.jpg" alt="" class="img-responsive">
 <img src="assets/img/masonry/4.jpg" alt="" class="img-responsive m-image">
      </div>
          <div class="col-md-4">
          <img src="assets/img/masonry/5.jpg" alt="" class="img-responsive">
 <img src="assets/img/masonry/6.jpg" alt="" class="img-responsive m-image">
      </div>
    </div>
  </div>
</section>
<!--<img src="assets/img/d-strip.jpg" alt="" class="img-responsive m-image">-->
<section class="destinations">
  <div class="container-fluid">
<div class="row">
  <div class="col-md-12">
  <h2>Select Destinations</h2>

    <label><input name="chk1" id="chk1" class="check_box" type="checkbox" checked>International</label>
    <label><input name="chk2" id="chk2" class="check_box" type="checkbox">Domestic</label>
    <div id="yourdiv">

    <div class="owl-carousel owl-theme" id="owl-one">
   
      <div class="item"><a href=""><img src="assets/img/thailand.jpg" class="img-respopnsive"></a><h4></h4></div>
 <div class="item"><a href=""><img src="assets/img/bali-1.jpg" class="img-respopnsive"></a><h4></h4></div>
 <div class="item"><a href=""><img src="assets/img/singapore.jpg" class="img-respopnsive"></a><h4></h4></div>
  <div class="item"><a href=""><img src="assets/img/maldives.jpg" class="img-respopnsive"></a><h4></h4></div>
  <div class="item"><a href=""><img src="assets/img/dubai.jpg" class="img-respopnsive"></a><h4></h4></div>
</div>

    </div>
    <div id="yourdiv2">

  <div class="owl-carousel owl-theme" id="owl-one">
  <div class="item"><a href=""><img src="assets/img/goa.jpg" class="img-respopnsive"></a><h4></h4></div>
    <div class="item"><a href=""><img src="assets/img/rajasthan.jpg" class="img-respopnsive"></a><h4></h4></div>
    <div class="item"><a href=""><img src="assets/img/kerala.jpg" class="img-respopnsive"></a><h4></h4></div>
     <div class="item"><a href=""><img src="assets/img/sikkim.jpg" class="img-respopnsive"></a><h4></h4></div>
        <div class="item"><a href=""><img src="assets/img/kashmir.jpg" class="img-respopnsive"></a><h4></h4></div>
</div>
    </div>
</div>
</div>
  </div>
</section>

    <section id="testimonials" class="section-bg wow fadeInUp">
      <div class="container">

        <header class="section-header">
          <h3>Testimonials</h3>
        </header>

  <div class="row about-cols">

          <div class="col-md-4 wow fadeInUp">
            <div class="about-col">
              <div class="testimonial-item">
                <img src="assets/img/testimonial-1.jpg" alt="" class="img-fluid testimonial-img">
               
              </div>
    
                <p>
                Sed ut perspiciatis unde omnis iste natus error sit voluptatem  doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
              </p>
            </div>
          </div>

          <div class="col-md-4 wow fadeInUp" data-wow-delay="0.1s">
            <div class="about-col">
               <div class="testimonial-item">
                <img src="assets/img/team-2.jpg" alt="" class="img-fluid testimonial-img">
               
              </div>
             
              <p>
                Sed ut perspiciatis unde omnis iste natus error sit voluptatem  doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
              </p>
            </div>
          </div>

          <div class="col-md-4 wow fadeInUp" data-wow-delay="0.2s">
            <div class="about-col">
              <div class="testimonial-item">
                <img src="assets/img/team-1.jpg" alt="" class="img-fluid testimonial-img">
               
              </div>
              
              <p>
                Nemo enim ipsam voluptatem quia voluptas sit aut odit aut fugit, sed quia magni dolores eos qui ratione voluptatem sequi nesciunt Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet.
              </p>
            </div>
          </div>

        </div>
      </div>
    </section><!-- #testimonials -->

    <!--==========================
      Team Section
    ============================-->
     <section id="abouts">
      <div class="full ">

        <header class="section-header">
          <h3>Blog</h3>
       
        </header>

        <div class="row about-cols">

          <div class="col-md-4 wow fadeInUp">
            <div class="about-col">
              <div class="img">
                <img src="assets/img/about-mission.jpg" alt="" class="img-fluid">
               
              </div>
              <h2 class="title"><a href="assets/#">Girl’s Guide to Hiking Solo</a></h2>
                <p>
                Sed ut perspiciatis unde omnis iste natus error sit voluptatem  doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
              </p>
            </div>
          </div>

          <div class="col-md-4 wow fadeInUp" data-wow-delay="0.1s">
            <div class="about-col">
              <div class="img">
                 <img src="assets/img/istanbul.jpg" alt="" class="img-fluid">
           
              </div>
              <h2 class="title"><a href="assets/#">10 Offbeat Things to Do in Istanbul</a></h2>
              <p>
                Sed ut perspiciatis unde omnis iste natus error sit voluptatem  doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
              </p>
            </div>
          </div>

          <div class="col-md-4 wow fadeInUp" data-wow-delay="0.2s">
            <div class="about-col">
              <div class="img">
                <img src="assets/img/bali.jpg" alt="" class="img-fluid">
                
              </div>
              <h2 class="title"><a href="assets/#">17 Things to See and Do in Bali</a></h2>
              <p>
                Nemo enim ipsam voluptatem quia voluptas sit aut odit aut fugit, sed quia magni dolores eos qui ratione voluptatem sequi nesciunt Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet.
              </p>
            </div>
          </div>

        </div>

      </div>
    </section><!-- #about -->
 
    <section id="clients" class="wow fadeInUp">
      <div class="container-fluid">
<div class="row">
<div class="col-md-12">
  <header class="section-header">
          <h3>From Our Instagram</h3>
        </header>
  <div id="instagram-feed1" class="instagram_feed"></div>
</div>


</div>
</div>
      <div class="container">

     

  

      </div>
    </section><!-- #clients -->
  
    <footer id="footer">
 <div class="row about-cols">

          <div class="col-md-3 wow fadeInUp">
            <div class="about-col">
             <h2>About Us</h2>
                <ul>
<li>Flight Booking</li>
<li>Hotel Booking</li>
<li>Holiday Booking</li>
<li>Bus Booking</li>
<li>Visa Booking</li>
                </ul>
            </div>
          </div>

          <div class="col-md-3 wow fadeInUp" data-wow-delay="0.1s">
            <div class="about-col">
              <h2>Domestic Tours</h2>
             
            <ul>
<li>Kashmir Holiday Packages</li>
<li>Leh Ladakh Packages</li>
<li>Goa Holidays</li>
<li>Andaman Holidays</li>
<li>Kerala Tour Packages</li>
<li>Himachal packages</li>
            </ul>
            </div>
          </div>

          <div class="col-md-3 wow fadeInUp" data-wow-delay="0.2s">
            <div class="about-col">
              <h2>International Tours</h2>
              
            <ul>
<li>Dubai tour packages</li>
<li>Malaysia tour package</li>
<li>Singapore tour package</li>
<li>Thailand tour packages</li>
<li>Bali packages</li>
<li>Srilanka tour package</li>
<li>Europe tour packages</li>
<li>Mauritius packages</li>
<li>Maldives packages</li>
            </ul>
            </div>
          </div>
      <div class="col-md-3 wow fadeInUp" data-wow-delay="0.2s">
            <div class="about-col">
              <h2>Visa</h2>
              <ul>
              <li>Dubai Visa</li>
<li>Singapore Visa</li>
<li>Malaysia Visa</li>
<li>Thailand Visa</li>
<li>Sri Lanka Visa</li>
<li>Schengen Visa</li>
<li>US Visa</li>
<li>UK Visa</li>
<li>China Visa</li>
<li>Australia Visa</li>
</ul>
            </div>
          </div>
        </div>
  </footer><!-- #footer -->

 </div><!--end div -->


  <!-- Bootstrap core JavaScript-->
  <script src="{{asset('js/app.js')}}"></script>


</body>

</html>

Zerion Mini Shell 1.0