name : IV_009.php
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta http-equiv="expires" content="0">
    <title>interior visions | design firm in bangkok | บริษัทออกแบบตกแต่งภายใน</title>
    <link href="bootstrap/css/bootstrap.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
    <link rel="stylesheet" href="font-awesome/css/font-awesome.min.css">
</head>
<style type="text/css">
	 @font-face {
        src: url('font/db_pradit_x-webfont.woff2') format('woff2'),
        url('font/db_pradit_x-webfont.woff') format('woff');
          font-family: 'db_pradit_x';
          font-weight: normal;
          font-style: normal;
    }
    
    .nav>li>a:focus, .nav>li>a:hover {
      text-decoration: none;
      background-color: rgba(255, 255, 255, .1);
    }
    
    body{
	  font-family: 'db_pradit_x';
      font-size:20px;
      margin-top:100px
	}
	
	.nav_menu{
    font-family: 'db_pradit_x';
    margin-top: 30px;
    margin-bottom: 50px;
  }
  


	p.title_content{
	  font-family: 'db_pradit_x';
	  text-decoration:none;
	  font-size:30px;
    color:black;
    
	}

	p.content{
	  font-family: 'db_pradit_x';
	  text-decoration:none;
	  font-size:24px;
    color:black;
    margin-top:-25px;
    margin-bottom:0px;
	}

	a {
	  font-family: 'db_pradit_x';
	  text-decoration:none;
	  font-size:26px;
	  color:gray;
	}

	a:hover {
	  font-family: 'db_pradit_x';
	  text-decoration:none;
	  color:black;
	  font-weight:bold;
	}

	.content_video{
	  font-family: 'db_pradit_x';
	  font-size:30px;
	}

	h2{
	  font-size:80px;
	}      

	h3{
	  font-size:40px;
	}

	h4{
	  font-size:30px;
	}

	h5{
	  font-size:28px;
	}
	

  .active2{
  font-weight:bold;
  text-decoration:underline;
  color:black;
}

.active{
  font-weight:bold;
  text-decoration:none;
  color:black;
}


#myBtn {
  display: none;
  position: fixed;
  bottom: 15%;
  right: 0%;
  z-index: 99;
  border: none;
  cursor: pointer;
  padding: 15px;
  border-radius: 10px;
background-color: Transparent;
}

.fadeout{
  opacity:0.5;
}

.fadeout2{
  background-color: rgba(255,255,255,0.9);
}

.carousel-control.right {
    right: 0;
    left: auto;
    background-image: -webkit-linear-gradient(left,rgba(255,255,255,.0001) 0,rgba(255,255,255,.001) 100%);
    background-image: -o-linear-gradient(left,rgba(255,255,255,.0001) 0,rgba(255,255,255,.001) 100%);
    background-image: -webkit-gradient(linear,left top,right top,from(rgba(255,255,255,.0001)),to(rgba(255,255,255,.0001)));
    background-image: linear-gradient(to right,rgba(255,255,255,.0001) 0,rgba(255,255,255,.0001) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1);
    }
    
    .carousel-control.left {
      background-image: -webkit-linear-gradient(left,rgba(255,255,255,.0001) 0,rgba(255,255,255,.0001) 100%);
      background-image: -o-linear-gradient(left,rgba(255,255,255,.0001) 0,rgba(255,255,255,.0001) 100%);
      background-image: -webkit-gradient(linear,left top,right top,from(rgba(255,255,255,.0001)),to(rgba(255,255,255,.0001)));
      background-image: linear-gradient(to right,rgba(255,255,255,.0001) 0,rgba(255,255,255,.0001) 100%);
      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1);
    background-repeat: repeat-x;
}
.name_direc{
  font-size:28px;
  text-transform: uppercase;
}

input.search-query {
    line-height: 1.2;
    padding: 0 0 0 25px;
}

input.search-query {
    background-color: transparent;
    border: 0;
    text-align: left;
    width: 100%;
    position: relative;
    box-sizing: border-box;
}

.textstyle_title, h1.textstyle_title, h2.textstyle_title {
    font-size: 47px;
    letter-spacing: 0.023em;
    font-weight: 300;
    line-height: 1.1;
}

.searchnav{
  opacity:0;
}

.show{
  display: block;
}

.fadeIn2{
  opacity:1;
}

input:focus{
    outline: none;
}
</style>
<body>
  
<button onclick="topFunction()" id="myBtn" title="Go to top" ><img src="images/up.png" width="50px" class="img-responsive" /></button>
<?php include('layout/navbar.php'); ?>    
<?php include('layout/header.php'); ?>
<div class="container-fluid hidden-xs">
<div class="col-md-12 "  style="margin-top:-7px;padding-left:0px;padding-right:0px;" >  
  <img src="images/border.png" class="img-responsive hidden-xs " />
  <img src="images/border_m.png" class="img-responsive  hidden-sm hidden-md hidden-lg" />
</div>
</div>
<div class="container-fluid4 hidden-sm hidden-md hidden-lg">
<div class="col-md-12 "  style="margin-top:-7px;padding-left:0px;padding-right:0px;" >  
  <img src="images/border.png" class="img-responsive hidden-xs " />
  <img src="images/border_m.png" class="img-responsive  hidden-sm hidden-md hidden-lg" />
</div>
</div>
<div class="container-fluid">
        <div class="row">
        <div class="col-md-12">  
            <div class="nav_menu"> 
                <span><a href="IV_007.php">Company</a></span>
                <span style="padding-left:25px;"><a href="IV_008.php">Directors</a> </span>
                <span style="padding-left:25px;"><a href="IV_009.php" style="font-weight: bold;" class="active">Team</a></span>   
            </div>
        </div>
      </div>
      <div class="row">
        <div class="col-md-10 col-md-offset-1 hidden-xs hidden-sm">
          <div id="myCarousel" class="carousel slide" data-ride="carousel">
            <!-- Indicators -->
              <ol class="carousel-indicators">
                <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
                <?php 
                  include('config/config.php');
                  $sql = "SELECT * FROM teams WHERE t_id not in (SELECT t_id FROM teams WHERE t_id = 1)";
                  $res = $conn->query($sql);
                  $n = 0;
                  while($row = $res->fetch_assoc()){
                ?> 
                <li data-target="#myCarousel" data-slide-to="<?php ++$n; ?>"></li>
                <?php } ?>

              </ol>
              <div class="carousel-inner">
                    <?php 
                      include('config/config.php');
                      $sql = "SELECT * FROM teams limit 1";
                      $res = $conn->query($sql);
                      $n = 0;
                      while($row = $res->fetch_assoc()){
                    ?> 
                    <div class="item active">
                      <img src="<?php echo $row['t_image']; ?>" class="img-responsive">
                    </div>
                    <?php 
                      }
                    ?>
                    <?php 
                      include('config/config.php');
                      $sql = "SELECT * FROM teams WHERE t_id not in (SELECT t_id FROM teams WHERE t_id = 1)";
                      $res = $conn->query($sql);
                      $n = 0;
                      while($row = $res->fetch_assoc()){
                    ?> 
                    <div class="item">
                      <img src="<?php echo $row['t_image']; ?>" class="img-responsive">
                    </div>
                    <?php 
                      }
                    ?>
              </div>
          </div>
          <a class="left carousel-control" href="#myCarousel" data-slide="prev">
                <span class="glyphicon glyphicon-chevron-left"></span>
                <span class="sr-only">Previous</span>
              </a>
              <a class="right carousel-control" href="#myCarousel" data-slide="next">
                <span class="glyphicon glyphicon-chevron-right"></span>
                <span class="sr-only">Next</span>
              </a>
        </div>
      </div>
      <div class="row" style="margin-bottom:100px;">
              <div class="hidden-md hidden-lg">
              <?php 
                  include('config/config.php');
                  $sql = "SELECT * FROM teams ";
                  $res = $conn->query($sql);
                  $n = 0;
                  while($row = $res->fetch_assoc()){
              ?> 
                  <div class="col-md-3" style="margin-bottom:15px;"> 
                      <img src="<?php echo $row['t_image']; ?>" class="img-responsive"/>
                  </div>
              <?php 
                  } 
              ?>
                  
              </div>
            </div>
            <?php include('layout/search.php'); ?>
</div>
<div class="container-fluid hidden-xs">
<div class="col-md-12 "  style="margin-top:-7px;padding-left:0px;padding-right:0px;" >  
  <img src="images/border.png" class="img-responsive hidden-xs " />
  <img src="images/border_m.png" class="img-responsive  hidden-sm hidden-md hidden-lg" />
</div>
<div class=" footer_logo">
    <div class="col-md-12" style="padding-bottom:0px;padding-left:0px;padding-right:0px;">
        <p class="text-right" style="margin-bottom:0px;">
          <a href="https://www.facebook.com/interiorvisions" target="_blank"><img src="images/icon/f.jpg" width="25px" height="25px"/></a>
          <a href="https://www.instagram.com/interior.visions/" target="_blank"><img src="images/icon/i.jpg" width="25px" height="25px"/></a>
          <a href="https://www.pinterest.com/interior_visions/" target="_blank"><img src="images/icon/p.jpg" width="25px" height="25px"/></a>
          <a href="#" ><img src="images/icon/m.jpg" width="25px" height="25px"/></a>
        </p>
    </div>
</div>
  <div class="col-md-12" style="margin-top:-10px;padding-left:0px;padding-right:0px;">
    <p class="text-right">copyright 2017. Interior Visions. </p>
  </div>
</div>
<div class="container-fluid4 hidden-sm hidden-md hidden-lg">
<div class="col-md-12 "  style="margin-top:-7px;padding-left:0px;padding-right:0px;" >  
  <img src="images/border.png" class="img-responsive hidden-xs " />
  <img src="images/border_m.png" class="img-responsive  hidden-sm hidden-md hidden-lg" />
</div>
<div class=" footer_logo">
    <div class="col-md-12" style="padding-bottom:0px;padding-left:0px;padding-right:0px;">
        <p class="text-right" style="margin-bottom:0px;">
          <a href="https://www.facebook.com/interiorvisions" target="_blank"><img src="images/icon/f.jpg" width="25px" height="25px"/></a>
          <a href="https://www.instagram.com/interior.visions/" target="_blank"><img src="images/icon/i.jpg" width="25px" height="25px"/></a>
          <a href="https://www.pinterest.com/interior_visions/" target="_blank"><img src="images/icon/p.jpg" width="25px" height="25px"/></a>
          <a href="#" ><img src="images/icon/m.jpg" width="25px" height="25px"/></a>
        </p>
    </div>
</div>
    <div class="col-md-12" style="margin-top:-10px;">
        <p class="text-right">copyright 2017. Interior Visions. </p>
    </div>
</div>
</body>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<script src="js/imagesLoaded.js"></script>
<script src="js/masonry.js"></script>
<script src="js/link.js"></script>
<script>
    $(document).ready(function(){
      $(document).bind("contextmenu",function(e){
            return false;
        });
    });
    
      $(document).ready(function() {
        $(".search-query").keyup(function(){
         var q  =  $(".search-query").val();
         $.ajax({
          url:"layout/check_project.php",
          type:"post",
          data:{q:q},
         }).done(function(data){
            $("#show_serach").html(data);
         });
        });
      });  
</script>
<script>
    $(document).ready(function() {
        $(window).scroll( function(){
            $('.hideme').each( function(i){
                var bottom_of_object = $(this).offset().top + $(this).outerHeight();
                var bottom_of_window = $(window).scrollTop() + $(window).height();
                if( bottom_of_window > bottom_of_object ){
                    $(this).animate({'opacity':'1'},500);   
                }
            }); 
        });
    });
   
  </script>
<script>
      function openNav() {
        $("#mySidenav").css("width","100%");
        $("#mySidenav").addClass("fadeIn2");
        $("#mySidenav").addClass("show");
        $(".navbar2").fadeOut(50);
    }

    /* Close/hide the sidenav */
    function closeNav() {
        $(".navbar").fadeIn(1000);
        $(".navbar2").fadeIn(1000);
        $("#mySidenav").css("width","0%");
        $("#mySidenav").addClass("searchnav");
        $("#mySidenav").removeClass("fadeIn2");
        $("#mySidenav").removeClass("show");
    }

    function openNav2() {
       $("#searchnav").css("width","100%");
        $("#searchnav").addClass("fadeIn2");
        $("#searchnav").addClass("show");
        $(".navbar").fadeOut(100);
    }

    function closeNav2() {
      $(".navbar").fadeIn(1000);
      $("#searchnav").css("width","0%");
      $("#mySidenav").css("width","0%");
      $("#searchnav").removeClass("fadeIn2");
      $("#searchnav").removeClass("show");
      $(".navbar").fadeIn(1000);
      $(".navbar2").fadeIn(1000);
      $("#mySidenav").removeClass("fadeIn2");
      $("#mySidenav").removeClass("show");
  }

      function showImages(el) {
        var windowHeight = jQuery( window ).height();
        $(el).each(function(){
            var thisPos = $(this).offset().top;

						var topOfWindow = $(window).scrollTop();
						
            if (topOfWindow + windowHeight - 5 > thisPos ) {
                $(this).addClass("fadeIn");
            }
        });
    }

    $(document).ready(function(){
            showImages('.star');
    });

    $(window).scroll(function() {
            showImages('.star');
    });
</script>
<script>
window.onscroll = function() {scrollFunction()};
  function scrollFunction() {
    if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
      document.getElementById("myBtn").style.display = "block";
      $(".navbar").addClass("fadeout2");
      $(".navbar2").addClass("fadeout2");
    } else {
        document.getElementById("myBtn").style.display = "none";
        $(".navbar").removeClass("fadeout2");
        $(".navbar2").removeClass("fadeout2");
    }
}

function topFunction() {
    $('body,html').animate({
      scrollTop: 0
  }, 1000);
}
</script>
<script>
(function( $ ) {

	var $container = $('.masonry-container');
	$container.imagesLoaded( function () {
		$container.masonry({
			columnWidth: '.item',
			itemSelector: '.item'
		});
	});
	
	//Reinitialize masonry inside each panel after the relative tab link is clicked - 
	$('a[data-toggle=tab]').each(function () {
		var $this = $(this);

		$this.on('shown.bs.tab', function () {
		
			$container.imagesLoaded( function () {
				$container.masonry({
					columnWidth: '.item',
					itemSelector: '.item'
				});
			});

		}); //end shown
	});  //end each
	
})(jQuery);
</script>
<script>
    $(document).ready(function() {
      var pathname = window.location.pathname; // Returns path only
      var url      = window.location.href;     // Returns full URL
      var test = url.slice(-7);

      console.log(test);
        if(test == "009.php"){
            $("#about").addClass('active2');
            $("#about2").addClass('active2');
        }
      
    });
</script>
</html>

© 2024 UnknownSec