Styleguide

Styleguide Overview

There are various styles and shortcodes that are built into this site that can be easily utilized for various page layouts. See the items to the right for more info.

 

General Styleguide Information:
[tab] [tab_item title=”Font Colors”]

Font Colors:
Brown font color – #532401
Green button color – #1b6e2a
Dark Green button rollover color – #104519
Dark Gray  – #959595
Light Gray– #ececec
Medium
Blue – #187297
Dark Blue – #0c465e
Light Blue – #ebf6fc
Light Yellow – #fbf9f4 (display is not true color)

[/tab_item] [tab_item title=”Image Sizing and Cropping”]

Image Sizing and Cropping:
It is best to size images based on the specs below before you upload into the system, but if that is not possible there is a built in sizing/cropping tool. You must first crop the image to the aspect ratio you want, save, then scale it (scaling first then cropping does not work if the image is going to be small).

Once you insert an image onto a page you can click on the image and in the upper right corner an “edit image” icon will appear. From there you can modify additional properties, alignment, caption, link, margin space, border, size etc.

[/tab_item] [tab_item title=”Image Sizes”]Image Sizes:
Home page main feature slider – 980w X 310h
Home page row of 3 features – 92w X 113h
Home page feature below row of 3 – 230w X 106h

Sub-page header image – 980w x 100h (you must specify min height on the page when you add this image)
Project category image – 200w X 150h (og design 200×92)
Project listing image – 100w X 75h
Gallery Widget sizes – 2 column 70w x 53h, 3 column 40w x 30h

News regular – 640w x 240h
News small – 100w X 75h
News thumbnail – 55w X 55h

Left column feature image – 190w

Content page inline accent image – 200w X 150h

Photo gallery – set gallery shortcode to 200w X 150 h

Estuary news feature story image – 92w X 113h or 150w X 113h

[/tab_item] [tab_item title=”Paragraph Returns”]

Paragraph returns:
You can create a hard return by clicking the “shift” button and then the “return” button.

    Spacing after a hard return
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed tempor imperdiet metus vitae porta.

   Spacing after a regular return

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed tempor imperdiet metus vitae porta.

[/tab_item] [/tab] [divider scroll_text=””]
NO