Table with borders

Font: Roboto, Font size: 15px, Font weight: normal 400, Line height: 120%, Color: #464646

Borders

Thickness: 1px, Color: #CDCECF

Header row

Font: Istok Web, Font size: 17px, Font weight: bold 700, Line height: 110%, Color: #444444, Background color: #CDCECF

Font: Roboto, Font size: 15px, Font weight: normal 400, Line height: 120%, Color: #464646

Borders

Thickness: 1px, Color:  #CDCECF

Table with header and footer

Header row

Font: Istok Web, Font size: 17px, Font weight: bold 700, Line height: 110%, Color: #444444, Background color: #CDCECF

Font: Roboto, Font size: 15px, Font weight: normal 400, Line height: 120%, Color: #464646

Table footer

Font: Roboto, Font size: 15px, Font weight: bold 700, Line height: 120%, Color: #464646

Borders

Thickness: 1px, Color:  #CDCECF

Tables with header and formatted footer – for citizens

Formatted footers in tables are different on the pages for citizens from the ones for business users. While green hues are used for citizens, blue hues are used for business users (see chapter Color system).

Header row

Font: Istok Web, Font size: 17px, Font weight: bold 700, Line height: 110%, Color: #444444, Background color: #CDCECF

Font: Roboto, Font size: 15px, Font weight: normal 400, Line height: 120%, Color: #464646

Table footer

Font: Roboto, Font size: 15px, Font weight: bold 700, Line height: 120%, Color: #464646, Background color: #DDEAB9

Borders

Thickness: 1px, Color: #CDCECF

Tables with header and formatted footer – for business users

Header row

Font: Istok Web, Font size: 17px, Font weight: bold 700, Line height: 110%, Color: #444444, Background color: #CDCECF

Font: Roboto, Font size: 15px, Font weight: normal 400, Line height: 120%, Color: #464646

Table footer

Font: Roboto, Font size: 15px, Font weight: bold 700, Line height: 120%, Color: #464646, Background color: #D8ECF8

Borders

Thickness: 1px, Color:  #CDCECF

Example: http://www.nlb.si/delniski-kapital

Header row - inactive

Font: Istok Web, Font size: 20px, Font weight: regular 400, Line height: 110%, Color: #FFFFFF, Background color: #595478

Font: Roboto, Font size: 15px, Font weight: normal 400, Line height: 120%, Color: #464646

Background color of 1^st column - inactive

Background color: #EBEBEC

Background color of 2^nd column - inactive

Background color: #DDEAB9

Borders

Thickness: 1px, Color: #CDCECF

Button - inactive

Height: 38px

Font: Roboto, Font size: 16px, Font weight: normal 400, Color: #FFFFFF

Background color: #595478, Shadow #000000 20%

Header row - active

Font: Istok Web, Font size: 20px, Font weight: regular 400, Line height: 110%, Color: #FFFFFF, Background color: #464461

Font: Roboto, Font size: 15px, Font weight: normal 400, Line height: 120%, Color: #464646

Background color of 1^st column - active

Background color: #E1E1E2

Background color of 2^nd column - active

Background color: #D1E3A2

Borders

Thickness: 1px, Color: #CDCECF

Button - active

Font: Roboto, Font size: 16px, Font weight: normal 400, Color: #FFFFFF

Background color: #464461, Shadow #000000 20%

4-column tables with header row for citizens

Header row - inactive

Font: Istok Web, Font size: 20px, Font weight: regular 400, Line height: 110%, Color: #FFFFFF, Background color: #595478

Row title - inactive

Font: Istok Web, Font size: 20px, Font weight: regular 400, Line height: 110%, Color: #FFFFFF, Background color: #595478

Font: Roboto, Font size: 15px, Font weight: normal 400, Line height: 120%, Color: #464646

Background color of 1^st column - inactive

Background color: #EBEBEC

Background color of 2^nd column - inactive

Background color: #DDEAB9

Borders

Thickness: 1px, Color: #CDCECF

Button - inactive

Height: 38px

Font: Roboto, Font size: 16px, Font weight: normal 400, Color: #FFFFFF

Background color: #595478, Shadow #000000 20%

Example: http://www.nlb.si/osebni-racuni-primerjava

Header row - active

Font: Istok Web, Font size: 20px, Font weight: regular 400, Line height: 110%, Color: #FFFFFF, Background color: #464461

Row title - active

Font: Istok Web, Font size: 20px, Font weight: regular 400, Line height: 110%, Color: #FFFFFF, Background color: #595478

Font: Roboto, Font size: 15px, Font weight: normal 400, Line height: 120%, Color: #464646

Background color of 1^st column - active

Background color: #E1E1E2

Background color of 2^nd column - active

Background color: #D1E3A2

Borders

Thickness: 1px, Color: #CDCECF

Button - active

Font: Roboto, Font size: 16px, Font weight: normal 400, Color: #FFFFFF

Background color: #464461, Shadow #000000 20%

2-column tables - for citizens

Header row - inactive

Font: Istok Web, Font size: 20px, Font weight: regular 400, Line height: 110%, Color: #FFFFFF, Background color: #595478

Font: Roboto, Font size: 15px, Font weight: normal 400, Line height: 120%, Color: #464646

Background color of 1^st column - inactive

Background color: #EBEBEC

Background color of 2^nd column - inactive

Background color: #DDEAB9

Borders

Thickness: 1px, Color: #CDCECF

Button - inactive

Heights: 38px

Font: Roboto, Font size: 16px, Font weight: normal 400, Color: #FFFFFF

Background color: #595478, Shadow #000000 20%

Header row - active

Font: Istok Web, Font size: 20px, Font weight: regular 400, Line height: 110%, Color: #FFFFFF, Background color: #464461

Font: Roboto, Font size: 15px, Font weight: normal 400, Line height: 120%, Color: #464646

Background color of 1^st column - active

Background color: #E1E1E2

Background color of 2^nd column - active

Background color: #D1E3A2

Borders

Thickness: 1px, Color: #CDCECF

Button - active

Font: Roboto, Font size: 16px, Font weight: normal 400, Color: #FFFFFF

Background color: #464461, Shadow #000000 20%

4-column tables – for business users

Header row - inactive

Font: Istok Web, Font size: 20px, Font weight: regular 400, Line height: 110%, Color: #FFFFFF, Background color: #595478

Font: Roboto, Font size: 15px, Font weight: normal 400, Line height: 120%, Color: #464646

Background color of 1^st column - inactive

Background color: #EBEBEC

Background color of 2^nd column - inactive

Background color: #D8ECF8

Borders

Thickness: 1px, Color: #CDCECF

Button - inactive

Height: 38px

Font: Roboto, Font size: 16px, Font weight: normal 400, Color: #FFFFFF

Background color: #595478, Shadow #000000 20%

Header row - active

Font: Istok Web, Font size: 20px, Font weight: regular 400, Line height: 110%, Color: #FFFFFF, Background color: #464461

Font: Roboto, Font size: 15px, Font weight: normal 400, Line height: 120%, Color: #464646

Background color of 1^st column - active

Background color: #E1E1E2

Background color of 2^nd column - active

Background color: #C0E1F5

Borders

Thickness: 1px, Color: #CDCECF

Button - active

Font: Roboto, Font size: 16px, Font weight: normal 400, Color: #FFFFFF

Background color: #464461, Shadow #000000 20%

2-column tables – for business users

Header row - inactive

Font: Istok Web, Font size: 20px, Font weight: regular 400, Line height: 110%, Color: #FFFFFF, Background color: #595478

Font: Roboto, Font size: 15px, Font weight: normal 400, Line height: 120%, Color: #464646

Background color of 1^st column - inactive

Background color: #EBEBEC

Background color of 2^nd column - inactive

Background color: #D8ECF8

Borders

Thickness: 1px, Color: #CDCECF

Button - inactive

Height: 38px

Font: Roboto, Font size: 16px, Font weight: normal 400, Color: #FFFFFF

Background color: #595478, Shadow #000000 20%

Example: http://www.nlb.si/dnevno-nocni-trezor

Header row - active

Font: Istok Web, Font size: 20px, Font weight: regular 400, Line height: 110%, Color: #FFFFFF, Background color: #464461

Font: Roboto, Font size: 15px, Font weight: normal 400, Line height: 120%, Color: #464646

Background color of 1^st column - active

Background color: #E1E1E2

Background color of 2^nd column - active

Background color: #C0E1F5

Borders

Thickness: 1px, Color:  #CDCECF

Button - active

Font: Roboto, Font size: 16px, Font weight: normal 400, Color: #FFFFFF

Background color: #464461, Shadow #000000 20%

Table in lightbox