portfolioone.html (30148B)
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>Portfolio 3 Columns + Sidebar | 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"><a href="blog.html">Blog <i class="fa fa-angle-down"></i></a> 75 <ul role="menu" class="sub-menu"> 76 <li><a href="blog.html">Blog Default</a></li> 77 <li><a href="blogtwo.html">Timeline Blog</a></li> 78 <li><a href="blogone.html">2 Columns + Right Sidebar</a></li> 79 <li><a href="blogthree.html">1 Column + Left Sidebar</a></li> 80 <li><a href="blogfour.html">Blog Masonary</a></li> 81 <li><a href="blogdetails.html">Blog Details</a></li> 82 </ul> 83 </li> 84 <li class="dropdown active"><a href="portfolio.html">Portfolio <i class="fa fa-angle-down"></i></a> 85 <ul role="menu" class="sub-menu"> 86 <li><a href="portfolio.html">Portfolio Default</a></li> 87 <li><a href="portfoliofour.html">Isotope 3 Columns + Right Sidebar</a></li> 88 <li><a class="active" href="portfolioone.html">3 Columns + Right Sidebar</a></li> 89 <li><a href="portfoliotwo.html">3 Columns + Left Sidebar</a></li> 90 <li><a href="portfoliothree.html">2 Columns</a></li> 91 <li><a href="portfolio-details.html">Portfolio Details</a></li> 92 </ul> 93 </li> 94 <li><a href="shortcodes.html ">Shortcodes</a></li> 95 </ul> 96 </div> 97 <div class="search"> 98 <form role="form"> 99 <i class="fa fa-search"></i> 100 <div class="field-toggle"> 101 <input type="text" class="search-form" autocomplete="off" placeholder="Search"> 102 </div> 103 </form> 104 </div> 105 </div> 106 </div> 107 </header> 108 <!--/#header--> 109 110 111 <section id="page-breadcrumb"> 112 <div class="vertical-center sun"> 113 <div class="container"> 114 <div class="row"> 115 <div class="action"> 116 <div class="col-sm-12"> 117 <h1 class="title">Portfolio</h1> 118 <p>Be Creative</p> 119 </div> 120 </div> 121 </div> 122 </div> 123 </div> 124 </section> 125 <!--/#action--> 126 127 <section id="projects" class="padding-top"> 128 <div class="container"> 129 <div class="row"> 130 <div class="col-md-9 col-sm-8"> 131 <div class="row"> 132 <div class="col-xs-6 col-sm-6 col-md-4 portfolio-item branded logos"> 133 <div class="portfolio-wrapper"> 134 <div class="portfolio-single"> 135 <div class="portfolio-thumb"> 136 <img src="images/portfolio/1.jpg" class="img-responsive" alt=""> 137 </div> 138 <div class="portfolio-view"> 139 <ul class="nav nav-pills"> 140 <li><a href="portfolio-details.html"><i class="fa fa-link"></i></a></li> 141 <li><a href="images/portfolio/1.jpg" data-lightbox="example-set"><i class="fa fa-eye"></i></a></li> 142 </ul> 143 </div> 144 </div> 145 <div class="portfolio-info "> 146 <h2>Sailing Vivamus</h2> 147 </div> 148 </div> 149 </div> 150 <div class="col-xs-6 col-sm-6 col-md-4 portfolio-item branded folio"> 151 <div class="portfolio-wrapper"> 152 <div class="portfolio-single"> 153 <div class="portfolio-thumb"> 154 <img src="images/portfolio/2.jpg" class="img-responsive" alt=""> 155 </div> 156 <div class="portfolio-view"> 157 <ul class="nav nav-pills"> 158 <li><a href="portfolio-details.html"><i class="fa fa-link"></i></a></li> 159 <li><a href="images/portfolio/2.jpg" data-lightbox="example-set"><i class="fa fa-eye"></i></a></li> 160 </ul> 161 </div> 162 </div> 163 <div class="portfolio-info "> 164 <h2>Sailing Vivamus</h2> 165 </div> 166 </div> 167 </div> 168 <div class="col-xs-6 col-sm-6 col-md-4 portfolio-item design logos"> 169 <div class="portfolio-wrapper"> 170 <div class="portfolio-single"> 171 <div class="portfolio-thumb"> 172 <img src="images/portfolio/3.jpg" class="img-responsive" alt=""> 173 </div> 174 <div class="portfolio-view"> 175 <ul class="nav nav-pills"> 176 <li><a href="portfolio-details.html"><i class="fa fa-link"></i></a></li> 177 <li><a href="images/portfolio/3.jpg" data-lightbox="example-set"><i class="fa fa-eye"></i></a></li> 178 </ul> 179 </div> 180 </div> 181 <div class="portfolio-info "> 182 <h2>Sailing Vivamus</h2> 183 </div> 184 </div> 185 </div> 186 <div class="col-xs-6 col-sm-6 col-md-4 portfolio-item design logos"> 187 <div class="portfolio-wrapper"> 188 <div class="portfolio-single"> 189 <div class="portfolio-thumb"> 190 <img src="images/portfolio/4.jpg" class="img-responsive" alt=""> 191 </div> 192 <div class="portfolio-view"> 193 <ul class="nav nav-pills"> 194 <li><a href="portfolio-details.html"><i class="fa fa-link"></i></a></li> 195 <li><a href="images/portfolio/4.jpg" data-lightbox="example-set"><i class="fa fa-eye"></i></a></li> 196 </ul> 197 </div> 198 </div> 199 <div class="portfolio-info "> 200 <h2>Sailing Vivamus</h2> 201 </div> 202 </div> 203 </div> 204 <div class="col-xs-6 col-sm-6 col-md-4 portfolio-item branded mobile"> 205 <div class="portfolio-wrapper"> 206 <div class="portfolio-single"> 207 <div class="portfolio-thumb"> 208 <img src="images/portfolio/5.jpg" class="img-responsive" alt=""> 209 </div> 210 <div class="portfolio-view"> 211 <ul class="nav nav-pills"> 212 <li><a href="portfolio-details.html"><i class="fa fa-link"></i></a></li> 213 <li><a href="images/portfolio/5.jpg" data-lightbox="example-set"><i class="fa fa-eye"></i></a></li> 214 </ul> 215 </div> 216 </div> 217 <div class="portfolio-info "> 218 <h2>Sailing Vivamus</h2> 219 </div> 220 </div> 221 </div> 222 <div class="col-xs-6 col-sm-6 col-md-4 portfolio-item branded mockup"> 223 <div class="portfolio-wrapper"> 224 <div class="portfolio-single"> 225 <div class="portfolio-thumb"> 226 <img src="images/portfolio/6.jpg" class="img-responsive" alt=""> 227 </div> 228 <div class="portfolio-view"> 229 <ul class="nav nav-pills"> 230 <li><a href="portfolio-details.html"><i class="fa fa-link"></i></a></li> 231 <li><a href="images/portfolio/6.jpg" data-lightbox="example-set"><i class="fa fa-eye"></i></a></li> 232 </ul> 233 </div> 234 </div> 235 <div class="portfolio-info "> 236 <h2>Sailing Vivamus</h2> 237 </div> 238 </div> 239 </div> 240 <div class="col-xs-6 col-sm-6 col-md-4 portfolio-item branded folio"> 241 <div class="portfolio-wrapper"> 242 <div class="portfolio-single"> 243 <div class="portfolio-thumb"> 244 <img src="images/portfolio/7.jpg" class="img-responsive" alt=""> 245 </div> 246 <div class="portfolio-view"> 247 <ul class="nav nav-pills"> 248 <li><a href="portfolio-details.html"><i class="fa fa-link"></i></a></li> 249 <li><a href="images/portfolio/7.jpg" data-lightbox="example-set"><i class="fa fa-eye"></i></a></li> 250 </ul> 251 </div> 252 </div> 253 <div class="portfolio-info "> 254 <h2>Sailing Vivamus</h2> 255 </div> 256 </div> 257 </div> 258 <div class="col-xs-6 col-sm-6 col-md-4 portfolio-item design logos"> 259 <div class="portfolio-wrapper"> 260 <div class="portfolio-single"> 261 <div class="portfolio-thumb"> 262 <img src="images/portfolio/8.jpg" class="img-responsive" alt=""> 263 </div> 264 <div class="portfolio-view"> 265 <ul class="nav nav-pills"> 266 <li><a href="portfolio-details.html"><i class="fa fa-link"></i></a></li> 267 <li><a href="images/portfolio/8.jpg" data-lightbox="example-set"><i class="fa fa-eye"></i></a></li> 268 </ul> 269 </div> 270 </div> 271 <div class="portfolio-info "> 272 <h2>Sailing Vivamus</h2> 273 </div> 274 </div> 275 </div> 276 <div class="col-xs-6 col-sm-6 col-md-4 portfolio-item branded logos"> 277 <div class="portfolio-wrapper"> 278 <div class="portfolio-single"> 279 <div class="portfolio-thumb"> 280 <img src="images/portfolio/9.jpg" class="img-responsive" alt=""> 281 </div> 282 <div class="portfolio-view"> 283 <ul class="nav nav-pills"> 284 <li><a href="portfolio-details.html"><i class="fa fa-link"></i></a></li> 285 <li><a href="images/portfolio/9.jpg" data-lightbox="example-set"><i class="fa fa-eye"></i></a></li> 286 </ul> 287 </div> 288 </div> 289 <div class="portfolio-info "> 290 <h2>Sailing Vivamus</h2> 291 </div> 292 </div> 293 </div> 294 <div class="col-xs-6 col-sm-6 col-md-4 portfolio-item branded mockup"> 295 <div class="portfolio-wrapper"> 296 <div class="portfolio-single"> 297 <div class="portfolio-thumb"> 298 <img src="images/portfolio/10.jpg" class="img-responsive" alt=""> 299 </div> 300 <div class="portfolio-view"> 301 <ul class="nav nav-pills"> 302 <li><a href="portfolio-details.html"><i class="fa fa-link"></i></a></li> 303 <li><a href="images/portfolio/10.jpg" data-lightbox="example-set"><i class="fa fa-eye"></i></a></li> 304 </ul> 305 </div> 306 </div> 307 <div class="portfolio-info "> 308 <h2>Sailing Vivamus</h2> 309 </div> 310 </div> 311 </div> 312 <div class="col-xs-6 col-sm-6 col-md-4 portfolio-item design folio"> 313 <div class="portfolio-wrapper"> 314 <div class="portfolio-single"> 315 <div class="portfolio-thumb"> 316 <img src="images/portfolio/11.jpg" class="img-responsive" alt=""> 317 </div> 318 <div class="portfolio-view"> 319 <ul class="nav nav-pills"> 320 <li><a href="portfolio-details.html"><i class="fa fa-link"></i></a></li> 321 <li><a href="images/portfolio/11.jpg" data-lightbox="example-set"><i class="fa fa-eye"></i></a></li> 322 </ul> 323 </div> 324 </div> 325 <div class="portfolio-info "> 326 <h2>Sailing Vivamus</h2> 327 </div> 328 </div> 329 </div> 330 <div class="col-xs-6 col-sm-6 col-md-4 portfolio-item design folio"> 331 <div class="portfolio-wrapper"> 332 <div class="portfolio-single"> 333 <div class="portfolio-thumb"> 334 <img src="images/portfolio/12.jpg" class="img-responsive" alt=""> 335 </div> 336 <div class="portfolio-view"> 337 <ul class="nav nav-pills"> 338 <li><a href="portfolio-details.html"><i class="fa fa-link"></i></a></li> 339 <li><a href="images/portfolio/12.jpg" data-lightbox="example-set"><i class="fa fa-eye"></i></a></li> 340 </ul> 341 </div> 342 </div> 343 <div class="portfolio-info "> 344 <h2>Sailing Vivamus</h2> 345 </div> 346 </div> 347 </div> 348 <div class="portfolio-pagination"> 349 <ul class="pagination"> 350 <li><a href="#">left</a></li> 351 <li><a href="#">1</a></li> 352 <li><a href="#">2</a></li> 353 <li class="active"><a href="#">3</a></li> 354 <li><a href="#">4</a></li> 355 <li><a href="#">5</a></li> 356 <li><a href="#">6</a></li> 357 <li><a href="#">7</a></li> 358 <li><a href="#">8</a></li> 359 <li><a href="#">9</a></li> 360 <li><a href="#">right</a></li> 361 </ul> 362 </div> 363 </div> 364 </div> 365 <div class="col-md-3 col-sm-4"> 366 <div class="sidebar portfolio-sidebar"> 367 <div class="sidebar-item categories"> 368 <h3>Project Categories</h3> 369 <ul class="nav navbar-stacked"> 370 <li><a href="#">Branded<span class="pull-right">(1)</span></a></li> 371 <li class="active"><a href="#">Design<span class="pull-right">(8)</span></a></li> 372 <li><a href="#">Folio<span class="pull-right">(4)</span></a></li> 373 <li><a href="#">Logos<span class="pull-right">(9)</span></a></li> 374 <li><a href="#">Mobile<span class="pull-right">(3)</span></a></li> 375 <li><a href="#">Mockup<span class="pull-right">(4)</span></a></li> 376 <li><a href="#">Php<span class="pull-right">(2)</span></a></li> 377 <li><a href="#">Wordpress<span class="pull-right">(8)</span></a></li> 378 </ul> 379 </div> 380 <div class="sidebar-item recent"> 381 <h3>Recent Projects</h3> 382 <div class="media"> 383 <div class="pull-left"> 384 <a href="#"><img src="images/portfolio/project1.jpg" alt=""></a> 385 </div> 386 <div class="media-body"> 387 <h4><a href="#">Lorem ipsum dolor sit amet consectetur adipisicing elit,</a></h4> 388 <p>posted on 07 March 2014</p> 389 </div> 390 </div> 391 <div class="media"> 392 <div class="pull-left"> 393 <a href="#"><img src="images/portfolio/project2.jpg" alt=""></a> 394 </div> 395 <div class="media-body"> 396 <h4><a href="#">Lorem ipsum dolor sit amet consectetur adipisicing elit,</a></h4> 397 <p>posted on 07 March 2014</p> 398 </div> 399 </div> 400 <div class="media"> 401 <div class="pull-left"> 402 <a href="#"><img src="images/portfolio/project3.jpg" alt=""></a> 403 </div> 404 <div class="media-body"> 405 <h4><a href="#">Lorem ipsum dolor sit amet consectetur adipisicing elit,</a></h4> 406 <p>posted on 07 March 2014</p> 407 </div> 408 </div> 409 </div> 410 <div class="sidebar-item popular"> 411 <h3>Popular Projects</h3> 412 <ul class="gallery"> 413 <li><a href="#"><img src="images/portfolio/popular1.jpg" alt=""></a></li> 414 <li><a href="#"><img src="images/portfolio/popular2.jpg" alt=""></a></li> 415 <li><a href="#"><img src="images/portfolio/popular3.jpg" alt=""></a></li> 416 <li><a href="#"><img src="images/portfolio/popular4.jpg" alt=""></a></li> 417 <li><a href="#"><img src="images/portfolio/popular5.jpg" alt=""></a></li> 418 <li><a href="#"><img src="images/portfolio/popular1.jpg" alt=""></a></li> 419 </ul> 420 </div> 421 </div> 422 </div> 423 </div> 424 </div> 425 </section> 426 <!--/#projects--> 427 428 429 <footer id="footer"> 430 <div class="container"> 431 <div class="row"> 432 <div class="col-sm-12 text-center bottom-separator"> 433 <img src="images/home/under.png" class="img-responsive inline" alt=""> 434 </div> 435 <div class="col-md-4 col-sm-6"> 436 <div class="testimonial bottom"> 437 <h2>Testimonial</h2> 438 <div class="media"> 439 <div class="pull-left"> 440 <a href="#"><img src="images/home/profile1.png" alt=""></a> 441 </div> 442 <div class="media-body"> 443 <blockquote>Nisi commodo bresaola, leberkas venison eiusmod bacon occaecat labore tail.</blockquote> 444 <h3><a href="#">- Jhon Kalis</a></h3> 445 </div> 446 </div> 447 <div class="media"> 448 <div class="pull-left"> 449 <a href="#"><img src="images/home/profile2.png" alt=""></a> 450 </div> 451 <div class="media-body"> 452 <blockquote>Capicola nisi flank sed minim sunt aliqua rump pancetta leberkas venison eiusmod.</blockquote> 453 <h3><a href="">- Abraham Josef</a></h3> 454 </div> 455 </div> 456 </div> 457 </div> 458 <div class="col-md-3 col-sm-6"> 459 <div class="contact-info bottom"> 460 <h2>Contacts</h2> 461 <address> 462 E-mail: <a href="mailto:someone@example.com">email@email.com</a> <br> 463 Phone: +1 (123) 456 7890 <br> 464 Fax: +1 (123) 456 7891 <br> 465 </address> 466 467 <h2>Address</h2> 468 <address> 469 Unit C2, St.Vincent's Trading Est., <br> 470 Feeder Road, <br> 471 Bristol, BS2 0UY <br> 472 United Kingdom <br> 473 </address> 474 </div> 475 </div> 476 <div class="col-md-4 col-sm-12"> 477 <div class="contact-form bottom"> 478 <h2>Send a message</h2> 479 <form id="main-contact-form" name="contact-form" method="post" action="sendemail.php"> 480 <div class="form-group"> 481 <input type="text" name="name" class="form-control" required="required" placeholder="Name"> 482 </div> 483 <div class="form-group"> 484 <input type="email" name="email" class="form-control" required="required" placeholder="Email Id"> 485 </div> 486 <div class="form-group"> 487 <textarea name="message" id="message" required="required" class="form-control" rows="8" placeholder="Your text here"></textarea> 488 </div> 489 <div class="form-group"> 490 <input type="submit" name="submit" class="btn btn-submit" value="Submit"> 491 </div> 492 </form> 493 </div> 494 </div> 495 <div class="col-sm-12"> 496 <div class="copyright-text text-center"> 497 <p>© Your Company 2014. All Rights Reserved.</p> 498 <p>Designed by <a target="_blank" href="http://www.themeum.com">Themeum</a></p> 499 </div> 500 </div> 501 </div> 502 </div> 503 </footer> 504 <!--/#footer--> 505 506 507 508 <script type="text/javascript" src="js/jquery.js"></script> 509 <script type="text/javascript" src="js/bootstrap.min.js"></script> 510 <script type="text/javascript" src="js/jquery.isotope.min.js"></script> 511 <script type="text/javascript" src="js/lightbox.min.js"></script> 512 <script type="text/javascript" src="js/wow.min.js"></script> 513 <script type="text/javascript" src="js/main.js"></script> 514 </body> 515 </html>