No Description

instagram.html 4.7KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146
  1. <!DOCTYPE html>
  2. <!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
  3. <!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
  4. <!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
  5. <!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
  6. <head>
  7. <meta charset="utf-8">
  8. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  9. <title>dato.pr</title>
  10. <meta name="viewport" content="width=device-width, initial-scale=1">
  11. <meta name="description" content="No" />
  12. <!-- Facebook and Twitter integration -->
  13. <meta property="og:title" content=""/>
  14. <meta property="og:image" content=""/>
  15. <meta property="og:url" content=""/>
  16. <meta property="og:site_name" content=""/>
  17. <meta property="og:description" content=""/>
  18. <meta name="twitter:title" content="" />
  19. <meta name="twitter:image" content="" />
  20. <meta name="twitter:url" content="" />
  21. <meta name="twitter:card" content="" />
  22. <!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
  23. <link rel="shortcut icon" href="favicon.ico">
  24. <link href="https://fonts.googleapis.com/css?family=Inconsolata:400,700" rel="stylesheet">
  25. <!-- Animate.css -->
  26. <link rel="stylesheet" href="css/animate.css">
  27. <!-- Icomoon Icon Fonts-->
  28. <link rel="stylesheet" href="css/icomoon.css">
  29. <!-- Simple Line Icons -->
  30. <link rel="stylesheet" href="css/simple-line-icons.css">
  31. <!-- Bootstrap -->
  32. <link rel="stylesheet" href="css/bootstrap.css">
  33. <!-- Style -->
  34. <link rel="stylesheet" href="css/style.css">
  35. <link rel="stylesheet" href="css/fancy.css">
  36. <!-- Spotify Icon -->
  37. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  38. <style type="text/css">
  39. h3 {text-align: center;}
  40. #fh5co-services {
  41. padding-bottom: 0;
  42. text-align: center;
  43. }
  44. </style>
  45. <!-- Modernizr JS -->
  46. <script src="js/modernizr-2.6.2.min.js"></script>
  47. <!-- FOR IE9 below -->
  48. <!--[if lt IE 9]>
  49. <script src="js/respond.min.js"></script>
  50. <![endif]-->
  51. </head>
  52. <body>
  53. <header role="banner" id="fh5co-header">
  54. <div class="fluid-container">
  55. <nav class="navbar navbar-default navbar-fixed-top js-fullheight">
  56. <div id="navbar" class="navbar-collapse js-fullheight">
  57. <ul class="nav navbar-nav navbar-left">
  58. <li class="active"><a href="#" data-nav-section="home"><span>Home</span></a></li>
  59. <li><a href="#" data-nav-section="services"><span>Services</span></a></li>
  60. </ul>
  61. </div>
  62. </nav>
  63. </div>
  64. </header>
  65. <section id="fh5co-home" data-section="home" style="background-image: url(images/project-5.jpg);">
  66. <div class="gradient"></div>
  67. <div class="container">
  68. <div class="text-wrap">
  69. <div class="text-inner">
  70. <div class="row">
  71. <div class="col-md-8 col-md-offset-2 text-center">
  72. <h1 style="color :white;" class="to-animate">dato.pr</h1>
  73. <h2 style="color :white;" class="to-animate">"Estudiando lo ambiguo <br> e investigando lo desconocido."</h2>
  74. </div>
  75. </div>
  76. </div>
  77. </div>
  78. </div>
  79. </section>
  80. <section id="fh5co-services" data-section="instagram">
  81. <div class="container">
  82. <style type="text/css">
  83. a img{
  84. align-items: center;
  85. position: relative;
  86. width: 30%;
  87. padding: 10px;
  88. padding-left: 10px;
  89. margin-top: 20px;
  90. overflow: hidden;
  91. opacity: 0;
  92. animation-name: fadeIn;
  93. animation-delay: 0.6s;
  94. animation-duration: 0.8s;
  95. animation-fill-mode: forwards;
  96. text-decoration: none;
  97. color: white;
  98. }
  99. </style>
  100. <h1 style="text-align: center">Instagram Feed</h1>
  101. <div id="instafeed-container"></div>
  102. <script src="https://cdn.jsdelivr.net/gh/stevenschobert/instafeed.js@2.0.0rc1/src/instafeed.min.js"></script>
  103. <script type="text/javascript">
  104. var userFeed = new Instafeed({
  105. get: 'user',
  106. target: "instafeed-container",
  107. resolution: 'low_resolution',
  108. limit: 9,
  109. accessToken: 'IGQVJVV0t4b2ZAIdkJPNTl1ZAnZAsWm90TzIzRE5LMGQtR25aRklwYlQ5eVEtcjZAmRmpEbDlNWC1RNjZAhaFJLdXBaLUJlaEM4WkRaamJNcWZACNWx1VThSYUNRLVJHcFNHWHlnWl9FTjBjcl9Vd1pPcFZAHbAZDZD'
  110. });
  111. userFeed.run();
  112. </script>
  113. </div>
  114. </section>
  115. <!-- jQuery -->
  116. <script src="js/jquery.min.js"></script>
  117. <!-- jQuery Easing -->
  118. <script src="js/jquery.easing.1.3.js"></script>
  119. <!-- Bootstrap -->
  120. <script src="js/bootstrap.min.js"></script>
  121. <!-- Waypoints -->
  122. <script src="js/jquery.waypoints.min.js"></script>
  123. <!-- Stellar Parallax -->
  124. <script src="js/jquery.stellar.min.js"></script>
  125. <!-- Counters -->
  126. <script src="js/jquery.countTo.js"></script>
  127. <!-- Main JS (Do not remove) -->
  128. <script src="js/main.js"></script>
  129. </body>
  130. </html>