Quick Links
Image sources:
Copyright Information:
All images used in this template are from
Pixabay with the exception of the office building and the gallery
photos. They are all royalty-free images and may be used in your
website.
Creative Commons Information:
All non-watermarked images are licensed under the
Creative Commons license, which means that you are free
to copy, modify and distribute them, including commercial sites, without asking the photographer's permission.
Home page slide show: 1175 pixels x 584 pixels*
Home page - top 1: 270 pixels x 550 pixels, top 2 & top 3: 270 pixels x 270 pixels*
Home page - Project images: 380 pixels x 240 pixels (note: you can make these images as tall as you like, however,
they must be 380 pixels wide to fill the space.)
About Us - People: 125 pixels x 125 pixels*
Gallery - Small images: I use 250 x 250 but you may choose to use larger or smaller sizes, Large images: your choice
(Note: I generally use a width of about 1000 pixels)
*Exact sizes are highly recommended to achieve the "look" of the template.
This template offers a variety of ways to present your images as shown below. All you have to do is add the specific image class to your image.
Float an image to the left without a border:
<img alt="" src="images/man1sm.jpg" class="img-left">
Float an image to the right without a border:
<img alt="" src="images/man1sm.jpg" class="img-right">
Float an image to the left
with a border:
<img alt="" class="img-border" src="images/man1sm.jpg">
Float an image to the right
with a border:
<img alt=""class="img-right-border" src="images/woman1sm.jpg">
Float an image to the left with a
border and a shadow:
<img alt="" class="img-catalog img-left" src="images/banner1.jpg">
Float an image to the right with a
border and a shadow:
<img alt="" class="img-catalog img-right" src="images/woman1sm.jpg">
Make a square image
appear to be round and float it to the left. [looks square in Design view]
<img alt="" class="img-round-left" src="images/banner1.jpg">
Make a square image appear to be round and float it to the right. [looks square in Design view]
<img alt="" class="img-round-right" src="images/woman1sm.jpg">
Float
an image to the left and add a frame to it:
<img alt="" class="img-frame img-left" src="images/banner1.jpg" >
Float
an image to the right and add a frame to it:
<img alt="" class="img-frame img-right" src="images/woman1sm.jpg" >
Float
an image to the left and curve the corners.
<img alt="" class="img-curved img-left" src="images/man1sm.jpg">
Float
an image to the right and curve the corners.
<img alt="" class="img-curved img-right" src="images/woman1sm.jpg">
Float
an image to the left and add padding and a light border.
<img alt="" class="img-gallery img-left" src="images/man1sm.jpg">
Float
an image to the right and add padding and a light border.
<img alt="" class="img-gallery img-right" src="images/woman1sm.jpg">
Float
an image to the left and tilt it to the left.
<img alt="" class="img-rotate-left img-left img-frame" src="images/man1sm.jpg">
Float
an image to the right and tilt it to the right.
<img alt="" class="img-rotate-right img-right img-frame" src="images/woman1sm.jpg">
Remember that you can add numerous classes to the images. This option gives you the ability to customized how your images look!
123 Main Street, Your City, Your State
1-800-123-4567
info@youraddress.com
Monday-Friday: 8-5
Saturday: Noon-5
Sunday: Closed
Morbi id dolor tellus. Cras nunc massa, congue sit amet interdum id, vulputate ac eros. Mauris eu adipiscing erat. Ut magna nunc, tincidunt in ultricies eu, elementum ut erat.