1. Start
  2. HTML Files & Structure
  3. CSS Files
  4. JavaScript
  5. Top Slider


HTML5 & CSS3 Template

Thank you for purchasing my theme. Our theme has an extensive documentation with easy to setup. If you still have some questions that you could not find in the scope of this help file, please contact me through email via my user page contact form here. You can also follow me on Themeforest to keep track of all my future themes, that you might be interested in. Thank you very much!

HTML Files & Structure

This archive contains five versions of the site. There is a brief description of each of the html page below.

One Page version consists of:

Multipage version consists of:

Coming soon version consists of:

To hange the styles, colors, and other options in the site you can in css/style.css file. Configurations of all plugins are in the file js/myscript.js

Each major section of HTML code is marked with special labels for the convenience of code search and altering them.

CSS Files

Below there are lists of the files, used in template styles.

Mind that these values might be overridden somewhere else in the file.

style.css file contains all of the specific stylings for the page.

Also with marks properties in the main css/style.css file, responsible for the style, are appropriated named. I'm using six CSS files in this theme.



If you would like to edit a specific section of the site, simply find the appropriate label in the CSS file, and then scroll down until you find the appropriate style that needs to be edited.

All images are found in the images. If you want to replace the image, just copy the folder with the same name as the original file with identical proportions.

Change of the active site color

After selecting one of the 10 colors, shown in the demo version sidebar, you must register it in the myscript.js. Example:

jQuery('< link href="css/colors/COLOR1" rel="stylesheet" type="text/css" id="colors" / >').appendTo('head');


Eleven Javascript files are used in this site.

Top Slider

In this template FlexSlider plugin is used (with additional effects of appearance). FlexSlider is easy to setup and convenient to use. For the emergence of the block with the specific effect, this external block is set data attribute

This site presents the effects used in this slider. To perform one of the effects used in this FlexSlider you need to write the name of the effect. Example: data-effect="bounceInDown"

The following data attribute cause slowing down the effect (calculated in ms).