banner - elements

General

Stripe Sections

The page content of a full-width page is composed of stripe sections.

  • On any page, the last stripe section inside #page-content should have additional .stripe-bottom class.
  • Any section with dark colored background should be used with additional .dark-colored-bg class.

The TransVision template has various types of stripe sections with different backgrounds.

Light Grey Background

Transparent Background

Light Grey Background

with optional "dots" pattern

White Background

Whitish Background

Primary Color Light Background

Primary Color Light Background

with optional "memphis" and semicircle background

Primary Color Pale Background

with smaller top and bottom paddings (optional "stripe-narrow" class)

Pale Background

Primary Color Solid Background

Primary Color Gradient Background

with optional "dots" pattern

Primary Color Gradient Background

with optional "diagonal pinstripe" pattern

Secondary Color Background

Secondary Color Background

with optional "memphis" background

Full-width Grey Background

in the left or right column of stripe section

Let me know, I'm ready to contact

+ Solid Background

Can be used with primary color or secondary color solid backgrounds.

Book a Free Discovery Session

Full-width Grey Background

in the left or right column of stripe section

Let me know, I'm ready to contact

+ Solid Background

Can be used with primary color or secondary color solid backgrounds.

Book a Free Discovery Session

Gradient Transparent Upper Layer

2 primary colors

Gradient Transparent Upper Layer

2 colors — primary & secondary

Custom Full-width Image

(in the stripe below)

how I can help you

Custom Background Image

with optional solid transparent upper layer + "diagonal lines" pattern

Custom Background Image

with optional solid (black) transparent upper layer

Custom Background Image

with optional gradient transparent upper layer (2 primary colors)

Custom Background Image

with optional gradient transparent upper layer (2 colors — primary & secondary)

+ fixed background

Default Background Image

with solid transparent upper layer

Default Background Image

with solid (black) transparent upper layer

Default Background Image

with gradient transparent upper layer (2 primary colors)

Default Background Image

with gradient transparent upper layer (2 colors - primary & secondary)