Styleguide

Default Text

Desktop Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
Tablet Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
Mobile Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

<small> or .small Default Text

Desktop Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
Tablet Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
Mobile Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

.medium1 Default Text

Desktop Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
Tablet Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
Mobile Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

.large1 Default Text

Desktop Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
Tablet Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
Mobile Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

Headings

Desktop

.t1large Header

Tablet

.t1large Header

Mobile

.t1large Header

Desktop
Tablet
Mobile

.t1 Header

.t1 Header

.t1 Header

.t2 Header

.t2 Header

.t2 Header

.t3 Header

.t3 Header

.t3 Header

.t4 Header

.t4 Header

.t4 Header

.t5 Header
.t5 Header
.t5 Header
.t6 Header
.t6 Header
.t6 Header
.morelink
.morelink
.morelink
 

Background Colors

.bgweb
Header
Header .t2
Header .t5
Text
Link
  • USP lorem ipsum
.bgweb2
Header
Header .t2
Header .t5
Text
Link
  • USP lorem ipsum
.bglist, .bgteaser, .bgusp
Header
Header .t2
Header .t5
Text
Link
  • USP lorem ipsum
.bglistalternate
Header
Header .t2
Header .t5
Text
Link
  • USP lorem ipsum
.bgbar
Header
Header .t2
Header .t5
Text
Link
  • USP lorem ipsum
.bghighlighted
Header
Header .t2
Header .t5
Text
Link
  • USP lorem ipsum
.bghighlighted2
Header
Header .t2
Header .t5
Text
Link
  • USP lorem ipsum
.bggallerybox
Header
Header .t2
Header .t5
Text
Link
  • USP lorem ipsum
.bgheader
Header
Header .t2
Header .t5
Text
Link
  • USP lorem ipsum
.bgheader2
Header
Header .t2
Header .t5
Text
Link
  • USP lorem ipsum
.bgmobile
Header
Header .t2
Header .t5
Text
Link
  • USP lorem ipsum
 

Paging (colors from bglist, bglistalternate, bgweb-button1)

1 2 3 4 5
 
 

Tabs

.tab3 (colors from bgweb-button1, bgweb-button2)

Tab
Tab active (.arrowtop)
Tab active (.arrowbottom)
 

.tabs4 (colors from bgweb, bglist)

Tab 1
Tab 2 active
Tab 3
 

.tabs5 (colors from bgweb-button1)

Tab 1
Tab 2 active
Tab 3
 
 

Default Iconset

icon-next
icon-prev
icon-up
icon-down
icon-callsign
icon-callsign-round
icon-callsign-round-inv
icon-enlarge
icon-decrease
icon-cross
icon-cross-round
icon-cross-round-inv
icon-plus
icon-plus-round
icon-plus-round-inv
icon-minus
icon-minus-round
icon-minus-round-inv
icon-search
icon-travel-children
icon-add-room
icon-remove-room
icon-add-additionalservice
icon-complete-data
icon-pencil
icon-pencil2
icon-phone
icon-email
icon-check
icon-check-round
icon-check-round-inv
icon-360
icon-map
icon-openfolder
icon-ban
icon-spinner
icon-menu
icon-basket
icon-clipboard
icon-divider
icon-facebook
icon-twitter
icon-googleplus
icon-youtube
icon-pinterest
icon-instagram
icon-location
icon-download
icon-zoom
icon-zoomin
icon-zoomout
icon-play
icon-pause
icon-share
icon-module
icon-star
icon-star-inv
icon-add-calendar
icon-remove-calendar


Default Form Iconset

icon-checkbox
icon-checkbox-checked
icon-checkbox-disabled
icon-radio
icon-radio-checked
icon-radio-disabled
icon-radio-checkeddisabled
icon-calendar