Mat is a new personal vcard template for everyone. Doctors, models, musicians, realtors, photographers, Graphic designers, freelancers or any kind of creative is now able to create a quick and easy portfolio to showcase their work with a distinctive and professional.

HTML Structure

We are used Bootstrap3 framework in this template. The general template structure is the same throughout the template. Here is the general structure.


<!doctype html>
<html lang="en">

<head>
    <title>Cloud Freelancer & Agency Portfolio Template</title>
    <meta charset="UTF-8">
    <meta name="description" content="Cloud Freelancer & Agency Portfolio Template">
    <meta name="keywords" content="personal, portfolio, agency">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- Favicon -->
    <link href="favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <!-- Stylesheets -->
    <link rel="stylesheet" href="css/bootstrap.css" />
    <link rel="stylesheet" href="css/reset.css" />
    <link rel="stylesheet" href="css/owl.theme.css" />
    <link rel="stylesheet" href="css/owl.carousel.css" />
    <link rel="stylesheet" href="css/style.css" />
    <link rel="stylesheet" href="css/color.css" />
    <!-- Google Web fonts -->
    <link href="https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700" rel="stylesheet">
    <!-- Font icons -->
    <link rel="stylesheet" href="icon-fonts/font-awesome-4.5.0/css/font-awesome.min.css" />
    <link rel="stylesheet" href="icon-fonts/web-design/flaticon.css" />
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>

<body>
    <div class="wrapper">
        <!-- HEADER -->
        <header>
            ...
        </header>
        <!-- HOME -->
        <div class="home">
            <div class="container">
                ...
            </div>
        </div>
        <!-- ABOUT -->
        <section class="about type-1 vertiqal top_90 ">
            <div class="container">
                ...
            </div>
        </section>
        <!-- PORTFOLIO -->
        <section class="portfolio type-1 top_120">
            <div class="container">
                ...
            </div>
        </section>
        <!-- BLOG -->
        <section class="blog type-1 standart top_30 bottom_120">
            <div class="container">
                ...
            </div>
        </section>
    </div>
    <!-- FOOTER -->
    <footer class="type-1">
        <div class="container">
            ...
        </div>
    </footer>
    <!-- Javascripts -->
    <script src="js/jquery-1.12.4.min.js"></script>
    <script src="js/main.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/parallax.js"></script>
    <script src="js/isotope.pkgd.min.js"></script>
    <script src="js/typed.js"></script>
    <script src="js/owl.carousel.min.js"></script>
</body>

</html>

Css Structure

Css organized in a list. You can easily find and edit the part you want.



Table of Content

  • 1. Body and Core Css
  • 2. Profile Section
  • 3. Navigation
  • 4. Home Section
  • 5. Resume Section
  • 6. Portfolio Section
  • 7. Blog Section
  • 8. Testimonial Section
  • 9. Contact Section
  • 10. Footer Section
  • 11. Realtor Portfolio
  • 12. Photo Gallery Widgets
  • 13. Table Widget
  • 14. Pricing Widget
  • 15. Events Widget
  • 16. Discography Widget
  • 17. Responsive

Javascript

  • js
    • bootstrap.min.js
    • isotope.pkgd.min.js
    • jquery-1.12.4.min.js
    • jquery.magnific-popup.min.js
    • main.js
    • owl.carousel.min.js
    • parallax.js
    • typed.js

  • bootstrap.min.js

Standart Bootstrap Library


  • isotope.pkgd.min.js

a plugin for portfolio masonry and filter features


  • jquery-1.12.4.min.js

Standart Jquery Library


  • jquery.magnific-popup.min.js

This plugin for portfolio lightbox gallery


  • main.js

Template javascript library


  • owl.carousel.min.js

Template sliders library


  • parallax.js

This plugin for parallax clouds


  • typed.js

This plugin for typed of home page