# Cobra - HTML5 Portfolio Template

## Welcome To Cobra - HTML5 Portfolio Template

Firstly, a huge thanks for purchasing this theme, your support is truly appreciated!

This document covers the installation and use of this theme and often reveals answers to common problems and issues - read this document thoroughly if you are experiencing any difficulties. If you have any questions that are beyond the scope of this document, feel free to contact us Thank you so much!

## Template Features

- Clean & Simple Design
- HTML5 & CSS3
- Fully Responsive Design
- All files are well commented
- Cross Browser Compatible with IE11+, Firefox, Safari, Opera, Chrome
- Fresh and Clean Code
- Code easy to customize
- Google Fonts
- Includes Font Awesome
- Includes Simple Line Icon

# Cobra - HTML5 Portfolio Template

## Installing Template.

1. After unzip the download pack, you'll found a Template Folder with all the files.
2. You can view this Template in any browser, you can display or edit the Template without an internet connection.(May not wotrk fonts and google map).
3. Now go to your cpanel or open your FTP Client (like Filezilla) and upload the content of the Template on your server root.
4. Once the files are done uploading go to www.yourdomainname.com/index.html

## Template Structure

All information within the main content area is nested within a body tag. The general template structure is pretty the same throughout the template. Here is the general structure of main page (index.html).

## CSS Files and Structure

These are the css files that are loaded into templates in Head Section.

You can find template style from assets/css/style.css
Our css file have table of contents and well commented. This will help you fast find and understend

    /*
    Style Index
    ==================================================
        1. Basic Style & Reset
        2. Header Menu
        3. Hero Area Section
        4. Services Area Section
        5. About Area Section
        6. Resume Area Section
        7. Works Area Section
        8. Price Area Section
        9. Hire Me Area
        10. Testimonial Area Section
        11. Blog Area Section
        12 Contact Area Section
        13. Footer Area
        14. Buttons
        15. Preloader
        16. Bootstrap Elements
        17. Go To Top
        18. Sticky Nav
        19. Slick Slider
    */
    /* =================================== */
    /*    Basic Style & Reset
    /* =================================== */

    /* reset elements */

    html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, div
    pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q,
    s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
    figure, header, nav, section, article, aside, footer, figcaption {
        margin: 0;
        padding: 0;
        border: 0;
        outline: 0;
    }

    ::-moz-selection {
        /* Code for Firefox */
        background-color: #e45447;
        color: #fff; }

    ::selection {
        background-color: #e45447;
        color: #fff; }

    ::-webkit-input-placeholder {
        /* WebKit, Blink, Edge */
        color: #777777;
        font-weight: 300; }

    :-moz-placeholder {
        /* Mozilla Firefox 4 to 18 */
        color: #777777;
        opacity: 1;
        font-weight: 300; }

    ::-moz-placeholder {
        /* Mozilla Firefox 19+ */
        color: #777777;
        opacity: 1;
        font-weight: 300; }

    :-ms-input-placeholder {
        /* Internet Explorer 10-11 */
        color: #777777;
        font-weight: 300; }

    ::-ms-input-placeholder {
        /* Microsoft Edge */
        color: #777777;
        font-weight: 300; }

    body {
        font-family: "Roboto", sans-serif;
        color: #777777;
        font-size: 15px;
        font-weight: 400;
        line-height: 1.625em;
        position: relative;
    }

    h1,h2,h3,
    h4,h5,h6 {
        font-family: "Poppins", sans-serif;
        color: #222222;
        font-weight: 400;
        line-height: 1.5;
    }

    h1, .h1 { font-size: 36px }

    h2, .h2 { font-size: 30px }

    h3, .h3 { font-size: 24px }

    h4, .h4 { font-size: 18px }

    h5, .h5 { font-size: 16px }

    h6, .h6 { font-size: 14px }

    .img { max-width: 100% }

    .clear { clear: both }

## Google Web Fonts

By default, the template loads this font from Google Web Font Services, you can change the font with the one that suits you best.

Remember to change the font into style.css

## Javascript Files and Structure

These are the list of Javascript files that are loaded into templates in end of the Body Section.

# Preloader

## Turn Off Preloader.

To turn off preloader screen open the index.html file using any text editor. Now look for the following code and remove them.

## Source and Credit

- Scripts:
  - jQuery library
  - Bootstrap v5
  - isotope
  - Owl Carousel
  - FontAwesome
  - Simple Line Icons
  - Slick Nav
  - Slick Slider
  - Popper
  - Scrollup
- Fonts:
  - Poppins Font
  - Roboto Font
- Font Icons:
  - Font Awesome
  - Simple Line Icons
- Images:
  - Pexels