blogfour.html (31020B)
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <meta name="description" content=""> 7 <meta name="author" content=""> 8 <title>Blog Masonry | Triangle</title> 9 <link href="css/bootstrap.min.css" rel="stylesheet"> 10 <link href="css/font-awesome.min.css" rel="stylesheet"> 11 <link href="css/lightbox.css" rel="stylesheet"> 12 <link href="css/animate.min.css" rel="stylesheet"> 13 <link href="css/main.css" rel="stylesheet"> 14 <link href="css/responsive.css" rel="stylesheet"> 15 16 <!--[if lt IE 9]> 17 <script src="js/html5shiv.js"></script> 18 <script src="js/respond.min.js"></script> 19 <![endif]--> 20 <link rel="shortcut icon" href="images/ico/favicon.ico"> 21 <link rel="apple-touch-icon-precomposed" sizes="144x144" href="images/ico/apple-touch-icon-144-precomposed.png"> 22 <link rel="apple-touch-icon-precomposed" sizes="114x114" href="images/ico/apple-touch-icon-114-precomposed.png"> 23 <link rel="apple-touch-icon-precomposed" sizes="72x72" href="images/ico/apple-touch-icon-72-precomposed.png"> 24 <link rel="apple-touch-icon-precomposed" href="images/ico/apple-touch-icon-57-precomposed.png"> 25 </head><!--/head--> 26 27 <body> 28 <header id="header"> 29 <div class="container"> 30 <div class="row"> 31 <div class="col-sm-12 overflow"> 32 <div class="social-icons pull-right"> 33 <ul class="nav nav-pills"> 34 <li><a href=""><i class="fa fa-facebook"></i></a></li> 35 <li><a href=""><i class="fa fa-twitter"></i></a></li> 36 <li><a href=""><i class="fa fa-google-plus"></i></a></li> 37 <li><a href=""><i class="fa fa-dribbble"></i></a></li> 38 <li><a href=""><i class="fa fa-linkedin"></i></a></li> 39 </ul> 40 </div> 41 </div> 42 </div> 43 </div> 44 <div class="navbar navbar-inverse" role="banner"> 45 <div class="container"> 46 <div class="navbar-header"> 47 <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 48 <span class="sr-only">Toggle navigation</span> 49 <span class="icon-bar"></span> 50 <span class="icon-bar"></span> 51 <span class="icon-bar"></span> 52 </button> 53 54 <a class="navbar-brand" href="index.html"> 55 <h1><img src="images/logo.png" alt="logo"></h1> 56 </a> 57 58 </div> 59 <div class="collapse navbar-collapse"> 60 <ul class="nav navbar-nav navbar-right"> 61 <li><a href="index.html">Home</a></li> 62 <li class="dropdown"><a href="#">Pages <i class="fa fa-angle-down"></i></a> 63 <ul role="menu" class="sub-menu"> 64 <li><a href="aboutus.html">About</a></li> 65 <li><a href="aboutus2.html">About 2</a></li> 66 <li><a href="service.html">Services</a></li> 67 <li><a href="pricing.html">Pricing</a></li> 68 <li><a href="contact.html">Contact us</a></li> 69 <li><a href="contact2.html">Contact us 2</a></li> 70 <li><a href="404.html">404 error</a></li> 71 <li><a href="coming-soon.html">Coming Soon</a></li> 72 </ul> 73 </li> 74 <li class="dropdown active"><a href="blog.html">Blog <i class="fa fa-angle-down"></i></a> 75 <ul role="menu" class="sub-menu"> 76 <li><a href="blogtwo.html">Timeline Blog</a></li> 77 <li><a href="blogone.html">2 Columns + Right Sidebar</a></li> 78 <li><a href="blogthree.html">1 Column + Left Sidebar</a></li> 79 <li><a class="active" href="blogfour.html">Blog Masonary</a></li> 80 <li><a href="blogdetails.html">Blog Details</a></li> 81 </ul> 82 </li> 83 <li class="dropdown"><a href="portfolio.html">Portfolio <i class="fa fa-angle-down"></i></a> 84 <ul role="menu" class="sub-menu"> 85 <li><a href="portfolio.html">Portfolio Default</a></li> 86 <li><a href="portfoliofour.html">Isotope 3 Columns + Right Sidebar</a></li> 87 <li><a href="portfolioone.html">3 Columns + Right Sidebar</a></li> 88 <li><a href="portfoliotwo.html">3 Columns + Left Sidebar</a></li> 89 <li><a href="portfoliothree.html">2 Columns</a></li> 90 <li><a href="portfolio-details.html">Portfolio Details</a></li> 91 </ul> 92 </li> 93 <li><a href="shortcodes.html ">Shortcodes</a></li> 94 </ul> 95 </div> 96 <div class="search"> 97 <form role="form"> 98 <i class="fa fa-search"></i> 99 <div class="field-toggle"> 100 <input type="text" class="search-form" autocomplete="off" placeholder="Search"> 101 </div> 102 </form> 103 </div> 104 </div> 105 </div> 106 </header> 107 <!--/#header--> 108 109 110 <section id="page-breadcrumb"> 111 <div class="vertical-center sun"> 112 <div class="container"> 113 <div class="row"> 114 <div class="action"> 115 <div class="col-sm-12"> 116 <h1 class="title">Blog</h1> 117 <p>Blog with left sidebar</p> 118 </div> 119 </div> 120 </div> 121 </div> 122 </div> 123 </section> 124 <!--/#action--> 125 126 <section id="blog" class="padding-top padding-bottom"> 127 <div class="container"> 128 <div class="row"> 129 <div class="masonery_area"> 130 <div class="col-md-3 col-sm-4"> 131 <div class="single-blog two-column"> 132 <div class="post-thumb"> 133 <a href="blogdetails.html"><img src="images/blog/masonary/1.jpg" class="img-responsive" alt=""></a> 134 <div class="post-overlay"> 135 <span class="uppercase"><a href="#">14 <br><small>Feb</small></a></span> 136 </div> 137 </div> 138 <div class="post-content overflow"> 139 <ul class="nav nav-justified post-nav"> 140 <li><a href="#"><i class="fa fa-tag"></i>Creative</a></li> 141 </ul> 142 <h2 class="post-title bold"><a href="blogdetails.html">Advanced business cards design</a></h2> 143 <h3 class="post-author"><a href="#">Posted by micron News</a></h3> 144 <p>Duis autem vel eum iriure dolor in hendrerit in blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber [...]</p> 145 <a href="#" class="read-more">View More</a> 146 <div class="post-bottom overflow"> 147 <ul class="nav nav-justified post-nav"> 148 <li><a href="#"><i class="fa fa-heart"></i>32 Love</a></li> 149 <li><a href="#"><i class="fa fa-comments"></i>3 Comments</a></li> 150 </ul> 151 </div> 152 </div> 153 </div> 154 </div> 155 <div class="col-md-3 col-sm-4"> 156 <div class="single-blog two-column"> 157 <div class="post-thumb"> 158 <audio src="audio/juicy.mp3" preload="auto"></audio> 159 </div> 160 <div class="post-content overflow"> 161 <ul class="nav nav-justified post-nav"> 162 <li><a href="#"><i class="fa fa-tag"></i>Creative</a></li> 163 <li><a href="#"><i class="fa fa-clock-o"></i>14 Feb</a></li> 164 </ul> 165 <h2 class="post-title bold"><a href="blogdetails.html">Advanced business cards design</a></h2> 166 <h3 class="post-author"><a href="#">Posted by micron News</a></h3> 167 <p>Duis autem vel eum iriure dolor in hendrerit in blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber [...]</p> 168 <a href="#" class="read-more">View More</a> 169 <div class="post-bottom overflow"> 170 <ul class="nav nav-justified post-nav"> 171 <li><a href="#"><i class="fa fa-heart"></i>32 Love</a></li> 172 <li><a href="#"><i class="fa fa-comments"></i>3 Comments</a></li> 173 </ul> 174 </div> 175 </div> 176 </div> 177 </div> 178 <div class="col-md-3 col-sm-4"> 179 <div class="single-blog two-column"> 180 <div class="post-thumb"> 181 <a href="blogdetails.html"><img src="images/blog/masonary/6.jpg" class="img-responsive" alt=""></a> 182 <div class="post-overlay"> 183 <span class="uppercase"><a href="#">14 <br><small>Feb</small></a></span> 184 </div> 185 </div> 186 <div class="post-content overflow"> 187 <ul class="nav nav-justified post-nav"> 188 <li><a href="#"><i class="fa fa-tag"></i>Creative</a></li> 189 </ul> 190 <h2 class="post-title bold"><a href="blogdetails.html">Advanced business cards design</a></h2> 191 <h3 class="post-author"><a href="#">Posted by micron News</a></h3> 192 <p>Duis autem vel eum iriure dolor in hendrerit in blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber [...]</p> 193 <a href="#" class="read-more">View More</a> 194 <div class="post-bottom overflow"> 195 <ul class="nav nav-justified post-nav"> 196 <li><a href="#"><i class="fa fa-heart"></i>32 Love</a></li> 197 <li><a href="#"><i class="fa fa-comments"></i>3 Comments</a></li> 198 </ul> 199 </div> 200 </div> 201 </div> 202 </div> 203 <div class="col-md-3 col-sm-4"> 204 <div class="single-blog two-column"> 205 <div class="post-thumb"> 206 <a href="blogdetails.html"><img src="images/blog/masonary/8.jpg" class="img-responsive" alt=""></a> 207 <div class="post-overlay"> 208 <span class="uppercase"><a href="#">14 <br><small>Feb</small></a></span> 209 </div> 210 </div> 211 <div class="post-content overflow"> 212 <ul class="nav nav-justified post-nav"> 213 <li><a href="#"><i class="fa fa-tag"></i>Creative</a></li> 214 </ul> 215 <h2 class="post-title bold"><a href="blogdetails.html">Advanced business cards design</a></h2> 216 <h3 class="post-author"><a href="#">Posted by micron News</a></h3> 217 <p>Duis autem vel eum iriure dolor in hendrerit in blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber [...]</p> 218 <a href="#" class="read-more">View More</a> 219 <div class="post-bottom overflow"> 220 <ul class="nav nav-justified post-nav"> 221 <li><a href="#"><i class="fa fa-heart"></i>32 Love</a></li> 222 <li><a href="#"><i class="fa fa-comments"></i>3 Comments</a></li> 223 </ul> 224 </div> 225 </div> 226 </div> 227 </div> 228 <div class="col-md-3 col-sm-4"> 229 <div class="single-blog two-column"> 230 <div class="post-thumb"> 231 <a href="blogdetails.html"><img src="images/blog/masonary/4.jpg" class="img-responsive" alt=""></a> 232 <div class="post-overlay"> 233 <span class="uppercase"><a href="#">14 <br><small>Feb</small></a></span> 234 </div> 235 </div> 236 <div class="post-content overflow"> 237 <ul class="nav nav-justified post-nav"> 238 <li><a href="#"><i class="fa fa-tag"></i>Creative</a></li> 239 </ul> 240 <h2 class="post-title bold"><a href="blogdetails.html">Advanced business cards design</a></h2> 241 <h3 class="post-author"><a href="#">Posted by micron News</a></h3> 242 <p>Duis autem vel eum iriure dolor in hendrerit in blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber [...]</p> 243 <a href="#" class="read-more">View More</a> 244 <div class="post-bottom overflow"> 245 <ul class="nav nav-justified post-nav"> 246 <li><a href="#"><i class="fa fa-heart"></i>32 Love</a></li> 247 <li><a href="#"><i class="fa fa-comments"></i>3 Comments</a></li> 248 </ul> 249 </div> 250 </div> 251 </div> 252 </div> 253 <div class="col-md-3 col-sm-4"> 254 <div class="single-blog two-column"> 255 <div class="post-thumb"> 256 <audio src="audio/juicy.mp3" preload="auto"></audio> 257 </div> 258 <div class="post-content overflow"> 259 <ul class="nav nav-justified post-nav"> 260 <li><a href="#"><i class="fa fa-tag"></i>Creative</a></li> 261 <li><a href="#"><i class="fa fa-clock-o"></i>14 Feb</a></li> 262 </ul> 263 <h2 class="post-title bold"><a href="blogdetails.html">Advanced business cards design</a></h2> 264 <h3 class="post-author"><a href="#">Posted by micron News</a></h3> 265 <p>Duis autem vel eum iriure dolor in hendrerit in blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber [...]</p> 266 <a href="#" class="read-more">View More</a> 267 <div class="post-bottom overflow"> 268 <ul class="nav nav-justified post-nav"> 269 <li><a href="#"><i class="fa fa-heart"></i>32 Love</a></li> 270 <li><a href="#"><i class="fa fa-comments"></i>3 Comments</a></li> 271 </ul> 272 </div> 273 </div> 274 </div> 275 </div> 276 <div class="col-md-3 col-sm-4"> 277 <div class="single-blog two-column"> 278 <div class="post-thumb"> 279 <a href="blogdetails.html"><img src="images/blog/masonary/2.jpg" class="img-responsive" alt=""></a> 280 <div class="post-overlay"> 281 <span class="uppercase"><a href="#">14 <br><small>Feb</small></a></span> 282 </div> 283 </div> 284 <div class="post-content overflow"> 285 <ul class="nav nav-justified post-nav"> 286 <li><a href="#"><i class="fa fa-tag"></i>Creative</a></li> 287 </ul> 288 <h2 class="post-title bold"><a href="blogdetails.html">Advanced business cards design</a></h2> 289 <h3 class="post-author"><a href="#">Posted by micron News</a></h3> 290 <p>Duis autem vel eum iriure dolor in hendrerit in blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber [...]</p> 291 <a href="#" class="read-more">View More</a> 292 <div class="post-bottom overflow"> 293 <ul class="nav nav-justified post-nav"> 294 <li><a href="#"><i class="fa fa-heart"></i>32 Love</a></li> 295 <li><a href="#"><i class="fa fa-comments"></i>3 Comments</a></li> 296 </ul> 297 </div> 298 </div> 299 </div> 300 </div> 301 <div class="col-md-3 col-sm-4"> 302 <div class="single-blog two-column"> 303 <div class="post-thumb"> 304 <a href="blogdetails.html"><img src="images/blog/masonary/10.jpg" class="img-responsive" alt=""></a> 305 <div class="post-overlay"> 306 <span class="uppercase"><a href="#">14 <br><small>Feb</small></a></span> 307 </div> 308 </div> 309 <div class="post-content overflow"> 310 <ul class="nav nav-justified post-nav"> 311 <li><a href="#"><i class="fa fa-tag"></i>Creative</a></li> 312 </ul> 313 <h2 class="post-title bold"><a href="blogdetails.html">Advanced business cards design</a></h2> 314 <h3 class="post-author"><a href="#">Posted by micron News</a></h3> 315 <p>Duis autem vel eum iriure dolor in hendrerit in blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber [...]</p> 316 <a href="#" class="read-more">View More</a> 317 <div class="post-bottom overflow"> 318 <ul class="nav nav-justified post-nav"> 319 <li><a href="#"><i class="fa fa-heart"></i>32 Love</a></li> 320 <li><a href="#"><i class="fa fa-comments"></i>3 Comments</a></li> 321 </ul> 322 </div> 323 </div> 324 </div> 325 </div> 326 <div class="col-md-3 col-sm-4"> 327 <div class="single-blog two-column"> 328 <div class="post-thumb"> 329 <a href="blogdetails.html"><img src="images/blog/masonary/7.jpg" class="img-responsive" alt=""></a> 330 <div class="post-overlay"> 331 <span class="uppercase"><a href="#">14 <br><small>Feb</small></a></span> 332 </div> 333 </div> 334 <div class="post-content overflow"> 335 <ul class="nav nav-justified post-nav"> 336 <li><a href="#"><i class="fa fa-tag"></i>Creative</a></li> 337 </ul> 338 <h2 class="post-title bold"><a href="blogdetails.html">Advanced business cards design</a></h2> 339 <h3 class="post-author"><a href="#">Posted by micron News</a></h3> 340 <p>Duis autem vel eum iriure dolor in hendrerit in blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber [...]</p> 341 <a href="#" class="read-more">View More</a> 342 <div class="post-bottom overflow"> 343 <ul class="nav nav-justified post-nav"> 344 <li><a href="#"><i class="fa fa-heart"></i>32 Love</a></li> 345 <li><a href="#"><i class="fa fa-comments"></i>3 Comments</a></li> 346 </ul> 347 </div> 348 </div> 349 </div> 350 </div> 351 <div class="col-md-3 col-sm-4"> 352 <div class="single-blog two-column"> 353 <div class="post-thumb"> 354 <a href="blogdetails.html"><img src="images/blog/masonary/5.jpg" class="img-responsive" alt=""></a> 355 <div class="post-overlay"> 356 <span class="uppercase"><a href="#">14 <br><small>Feb</small></a></span> 357 </div> 358 </div> 359 <div class="post-content overflow"> 360 <ul class="nav nav-justified post-nav"> 361 <li><a href="#"><i class="fa fa-tag"></i>Creative</a></li> 362 </ul> 363 <h2 class="post-title bold"><a href="blogdetails.html">Advanced business cards design</a></h2> 364 <h3 class="post-author"><a href="#">Posted by micron News</a></h3> 365 <p>Duis autem vel eum iriure dolor in hendrerit in blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber [...]</p> 366 <a href="#" class="read-more">View More</a> 367 <div class="post-bottom overflow"> 368 <ul class="nav nav-justified post-nav"> 369 <li><a href="#"><i class="fa fa-heart"></i>32 Love</a></li> 370 <li><a href="#"><i class="fa fa-comments"></i>3 Comments</a></li> 371 </ul> 372 </div> 373 </div> 374 </div> 375 </div> 376 <div class="col-md-3 col-sm-4"> 377 <div class="single-blog two-column"> 378 <div class="post-thumb"> 379 <a href="blogdetails.html"><img src="images/blog/masonary/9.jpg" class="img-responsive" alt=""></a> 380 <div class="post-overlay"> 381 <span class="uppercase"><a href="#">14 <br><small>Feb</small></a></span> 382 </div> 383 </div> 384 <div class="post-content overflow"> 385 <ul class="nav nav-justified post-nav"> 386 <li><a href="#"><i class="fa fa-tag"></i>Creative</a></li> 387 </ul> 388 <h2 class="post-title bold"><a href="blogdetails.html">Advanced business cards design</a></h2> 389 <h3 class="post-author"><a href="#">Posted by micron News</a></h3> 390 <p>Duis autem vel eum iriure dolor in hendrerit in blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber [...]</p> 391 <a href="#" class="read-more">View More</a> 392 <div class="post-bottom overflow"> 393 <ul class="nav nav-justified post-nav"> 394 <li><a href="#"><i class="fa fa-heart"></i>32 Love</a></li> 395 <li><a href="#"><i class="fa fa-comments"></i>3 Comments</a></li> 396 </ul> 397 </div> 398 </div> 399 </div> 400 </div> 401 </div> 402 </div> 403 </div> 404 </section> 405 <!--/#blog--> 406 407 <footer id="footer"> 408 <div class="container"> 409 <div class="row"> 410 <div class="col-sm-12 text-center bottom-separator"> 411 <img src="images/home/under.png" class="img-responsive inline" alt=""> 412 </div> 413 <div class="col-md-4 col-sm-6"> 414 <div class="testimonial bottom"> 415 <h2>Testimonial</h2> 416 <div class="media"> 417 <div class="pull-left"> 418 <a href="#"><img src="images/home/profile1.png" alt=""></a> 419 </div> 420 <div class="media-body"> 421 <blockquote>Nisi commodo bresaola, leberkas venison eiusmod bacon occaecat labore tail.</blockquote> 422 <h3><a href="#">- Jhon Kalis</a></h3> 423 </div> 424 </div> 425 <div class="media"> 426 <div class="pull-left"> 427 <a href="#"><img src="images/home/profile2.png" alt=""></a> 428 </div> 429 <div class="media-body"> 430 <blockquote>Capicola nisi flank sed minim sunt aliqua rump pancetta leberkas venison eiusmod.</blockquote> 431 <h3><a href="">- Abraham Josef</a></h3> 432 </div> 433 </div> 434 </div> 435 </div> 436 <div class="col-md-3 col-sm-6"> 437 <div class="contact-info bottom"> 438 <h2>Contacts</h2> 439 <address> 440 E-mail: <a href="mailto:someone@example.com">email@email.com</a> <br> 441 Phone: +1 (123) 456 7890 <br> 442 Fax: +1 (123) 456 7891 <br> 443 </address> 444 445 <h2>Address</h2> 446 <address> 447 Unit C2, St.Vincent's Trading Est., <br> 448 Feeder Road, <br> 449 Bristol, BS2 0UY <br> 450 United Kingdom <br> 451 </address> 452 </div> 453 </div> 454 <div class="col-md-4 col-sm-12"> 455 <div class="contact-form bottom"> 456 <h2>Send a message</h2> 457 <form id="main-contact-form" name="contact-form" method="post" action="sendemail.php"> 458 <div class="form-group"> 459 <input type="text" name="name" class="form-control" required="required" placeholder="Name"> 460 </div> 461 <div class="form-group"> 462 <input type="email" name="email" class="form-control" required="required" placeholder="Email Id"> 463 </div> 464 <div class="form-group"> 465 <textarea name="message" id="message" required="required" class="form-control" rows="8" placeholder="Your text here"></textarea> 466 </div> 467 <div class="form-group"> 468 <input type="submit" name="submit" class="btn btn-submit" value="Submit"> 469 </div> 470 </form> 471 </div> 472 </div> 473 <div class="col-sm-12"> 474 <div class="copyright-text text-center"> 475 <p>© Your Company 2014. All Rights Reserved.</p> 476 <p>Designed by <a target="_blank" href="http://www.themeum.com">Themeum</a></p> 477 </div> 478 </div> 479 </div> 480 </div> 481 </footer> 482 <!--/#footer--> 483 484 485 <script type="text/javascript" src="js/jquery.js"></script> 486 <script type="text/javascript" src="js/bootstrap.min.js"></script> 487 <script type="text/javascript" src="js/lightbox.min.js"></script> 488 <script type="text/javascript" src="js/wow.min.js"></script> 489 <script type="text/javascript" src="js/audio.min.js"></script> 490 <script> 491 audiojs.events.ready(function() { 492 var as = audiojs.createAll(); 493 }); 494 </script> 495 <script type="text/javascript" src="js/masonry.min.js"></script> 496 <script type="text/javascript" src="js/main.js"></script> 497 </body> 498 </html>