Webdeersign Project27 for Source 1

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper.

frost on tint

Overlapping layouts not only look new and fresh, but they also allow more text to be used because the text can flow onto the other "column". This has the effect of reducing the height of the text as the device width reduces. I.e. mote text can fit into a smaller space on a screen.

blurred background

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Felis aliquet egestas vitae, nibh ante quis quis dolor sed mauris. Erat lectus sem ut lobortis, adipiscing ligula eleifend, sodales fringilla mattis dui nullam. Ac massa aliquet.

blur

The image under this Grid Item will be Blurred.

Button text

blur

The image under this Grid Item will be Blurred.

tint

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper.

blur

The image under this Grid Item will be Blurred.

on tint

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper.

frost

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper. Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper.

frost

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper.

Button text

frost on blur

blur

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper.

frost

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper.

image on frost

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper.

Button text

frost on tint

frost on blur

Lorem ipsum dolor sit amet, sapien platea morbi dolor lacus nunc, nunc ullamcorper.

Button text

LAYOUT INFO 1

These layouts use a multiple single grid layout with 4 "columns" & 3 "rows". Some items are layered on top of or over adjacent grid items. Pretty much the same grid is used with changes to where each layer sits on top of which layer.

NOTE. The grid boundaries have been made visible in these images.

BRUR & FROST INFO

The Source functions BLUR & FROST are used to blur and extra blur whatever is under the layer with the BLUR or FROST function. Note that this functionality is currently disabled in Firefox (used by only 3% of web users) but a fallback effect has been added, as can be seen in this image. Other effects can be used on top or below, such as an additional tint.

This footer section is just a single grid item inside 1 grid.