Button Bar

Styles can be used with any semantic markup, eg a list of links:

With icons:

Buttons

Button

Alternate Button

Light Button

Disabled Button

Text Button

Button CTA

Button CTA Main

Button CTA Light

Alternate Button CTA

Alternate Button CTA

Pill Button

Pill Alternate Button

Pill Light Button

Smaller buttons

Small Button .btn2

Small Button .btn-small

Double_btns

Tags

Base tags

This is a tag

Alternative tags

This is an Alternative tag tag

Large tags (.tags-large)
Large tags with results number

Checkbox

Checkbox *

Radio Buttons

Radio

Select Menu

Submit Buttons

Text Fields

Animations

Fade: Duration: 0.3s Easing: ease-out (Hover to see effect)
Movement: Duration: 0.3s Easing: ease-in-out; (Hover to see effect)

Colours

Neutral, backgrounds and text

  • White #FFFFFF
  • Off white: #F1F1EE
  • Paper: #D9D4CA
  • Light gray: #777777
  • Medium gray: #4D4D4D
  • Dark Gray: #232323
  • Links: #095F90
  • Links Alt: #d12d1e
  • Dark Blue: #293745
  • Black: #1A1A1A

Top level section colours

  • Search: Blue: #1676AA
  • Labs: Jade green: #37B98B
  • Pro: Raspberry: #E11D53
  • Research: Purple: #7F3978
  • Project sites: Orange: #d43900

Brand colours

  • Yellow: #FFAE00
  • Red: #F22F24
  • Orange: #d43900
  • Raspberry: #E11D53
  • Jade green: #37B98B
  • Light Blue: #4BC0F0
  • Blue: #1676AA
  • Purple: #7F3978

Fonts

Body font:

"Open Sans", "Arial", sans-serif;

"Open Sans", "Arial", sans-serif;

"Open Sans", "Arial", sans-serif;

Secondary/Title font:

Ubuntu, Arial, sans-serif;

Ubuntu, Arial, sans-serif;

Ubuntu, Arial, sans-serif;

Visibility

This text is hidden on smaller screens

This text is only visible on smaller screens

This text is hidden on medium screens only

This text is only visible on medium screens

This text is hidden on large screens

This text is only visible on large screens

CSS Generator

TODO

  • inline viewbox editing
  • inline preview height adjust
  • inline x and y attributes
  • correct singleton path elements
  •  

SRC

SRC MODIFIED

CSS

Preview

General

These icons are inline inside the _head super-global pattern and are available at all times
icon-facebook
icon-twitter
icon-pinterest
icon-googleplus
icon-soundcloud
icon-github
icon-instagram
icon-tumblr
icon-delete
icon-next
icon-previous
icon-check
icon-help
icon-tag
icon-menu
icon-linkout
icon-search
icon-settings
General web
  • HOME
Feedback
Cloud/Upload/Download
Flagging
Shopping
Maps & wayfinding
Graphs
Communication
Editing
Arrows
Time
Devices
Media
Playback
Documents, Books and files
Layout
People and users

Global

These icons are inline inside the _head super-global pattern and are available at all times
icon-facebook
icon-twitter
icon-pinterest
icon-googleplus
icon-soundcloud
icon-github
icon-instagram
icon-tumblr
icon-delete
icon-next
icon-previous
icon-check
icon-help
icon-tag
icon-menu
icon-linkout
icon-search
icon-settings

In Text

In text

This is a short paragraph of text and here are some different icons in the text flow

Licenses

Social Media

Svg Icon 3d

Svg Icon Birth

Svg Icon Caret Down

Svg Icon Clock

Svg Icon Death

Svg Icon Down

Svg Icon Download

Svg Icon Ellipsis

Svg Icon Eye

Svg Icon Flag

Svg Icon Home

Svg Icon Instagram

Svg Icon Location

Svg Icon Maximize

Svg Icon Minimize

Svg Icon Minus

Svg Icon Music

Svg Icon Next

Svg Icon Openbook

Svg Icon Phone Landline

Svg Icon Phone Work

Svg Icon Play

Svg Icon Previous

Svg Icon Rss

Svg Icon Sendemail

Svg Icon Share

Svg Icon Tumblr

Svg Icon Tv

Svg Icon Video

Svg Icon Zoomin

Svg Icon Zoomout

Svg Icons All Generated

GENERATED ICON LIST


svg-icon-bookmark-before

svg-icon-bookmark-eu-blue

svg-icon-bookmark

svg-icon-bookmark-white-before

svg-icon-bookmark-white

svg-icon-calendar

svg-icon-calendar-white

svg-icon-clock

svg-icon-configuration

svg-icon-download

svg-icon-down

svg-icon-ellipsis-eu-blue

svg-icon-email

svg-icon-external-eu-blue-after

svg-icon-external-eu-blue

svg-icon-external-white-after

svg-icon-eye

svg-icon-form-field-calendar

svg-icon-home

svg-icon-image-grey-lighter

svg-icon-image

svg-icon-info

svg-icon-language

svg-icon-linkout

svg-icon-location

svg-icon-loggedin-user

svg-icon-minus

svg-icon-music-grey-lighter

svg-icon-music

svg-icon-next

svg-icon-notifications

svg-icon-openbook-grey-lighter

svg-icon-openbook

svg-icon-phone-landline

svg-icon-plus

svg-icon-previous

svg-icon-rss

svg-icon-search

svg-icon-tv-grey-lighter

svg-icon-tv

svg-icon-user

svg-icon-user-signin

svg-icon-zoom-in

svg-icon-zoom-out

Svg Rs Licenses

Svgicons Editing

view edit alert upload exit

Svgicons Global

Svgicons Pro

Svgicons User

Svgicons Users

Avatar

Avatar

Bg Landscape

Favicon

Landscape 16x9

16x9 Image

Landscape 4x3

4x3 Image

Loading Icon

Loading...

Portrait

Person Name

Responsive Srcset Picture

Square

Square Thumbnail

Definition

Definition List
A number of connected items or names written or printed consecutively, typically one below the other.
This is a term.
This is the definition of that term, which both live in a dl.
Here is another term.
And it gets a definition too, which is this line.
Here is term that shares a definition with the term below.
And it gets a definition too, which is this line.

Eu Autocomplete Item Template Entity

[[#extended_info]]
  • [[#is_concept]]Concept[[/is_concept]] [[#is_person]]Person[[/is_person]] [[#is_place]]Place[[/is_place]] [[#directMatch]][[directHitPreMatch]][[.]][[directHitPostMatch]][[/directMatch]] [[^directMatch]] [[#indirectMatch]][[unmatched]] ( [[indirectHitPreMatch]][[.]][[indirectHitPostMatch]][[#indirectLocale]] | [[.]][[/indirectLocale]] )[[/indirectMatch]] [[^indirectMatch]][[directHit]][[/indirectMatch]] [[/directMatch]] [[#life]][[/life]] [[#dateOfBirth]]Born [[.]][[/dateOfBirth]] [[#dateOfDeath]] Died [[.]] [[/dateOfDeath]] [[#life]][[/life]] [[#life_summary]][[.]][[/life_summary]]
  • [[/extended_info]] [[^extended_info]]
  • [[#directMatch]][[directHitPreMatch]][[.]][[directHitPostMatch]][[/directMatch]] [[^directMatch]] [[#indirectMatch]][[unmatched]] ( [[indirectHitPreMatch]][[.]][[indirectHitPostMatch]][[#indirectLocale]] | [[.]][[/indirectLocale]] )[[/indirectMatch]] [[^indirectMatch]][[directHit]][[/indirectMatch]] [[/directMatch]]
  • [[/extended_info]]

    Ordered

    An introductory paragraph for the list:

    1. This is a list item in an ordered list
    2. An ordered list is a list in which the sequence of items is important. An ordered list does not necessarily contain sequence characters.
    3. Lists can be nested inside of each other
      1. This is a nested list item
      2. This is another nested list item in an ordered list
    4. This is the last list item

    Unordered

    An introductory paragraph for the list:

    • This is a list item in an unordered list
    • An unordered list is a list in which the sequence of items is not important. Sometimes, an unordered list is a bulleted list. And this is a long list item in an unordered list that can wrap onto a new line.
    • Lists can be nested inside of each other
      • This is a nested list item
      • This is another nested list item in an unordered list
    • This is the last list item

    Audio

    Video

    Responsive Embedded Video (Youtube/Vimeo etc.)

    HTML5 Video

    CC Guidelines Test

    Test CC Guidelines

    Description

    This is the simplest working setup to get links to pages like linking back to data in the referring document.
    The above link works, but only because of an attribute on the test link below, and other data embedded in this page.

    The Data Needed

    namespaces

    No metadata is needed in the head of the document, but somewhere there has to be an element - like this span - that has the xml namespace attributes:
    • xmlns:cc="http://creativecommons.org/ns#"
    • xmlns:dc="http://purl.org/dc/elements/1.1/"
    • xmlns:xhv="http://www.w3.org/1999/xhtml/vocab#"

    title

    The "Work Details" title label comes from this span: Test Title which has the attribute
    • property="http://purl.org/dc/elements/1.1/title dc:title"

    attribution

    It is the link to the work's origin that generates the content of the "cite" box. These attributes are necessary on the <a> element:
    • property="cc:attributionName"
    • rel="cc:attributionURL"
    • href="the edm isShownAt"

    a guidelines referencing element

    An element - like this span - has to be present, with attributes referencing the guidelines document:
    • rel="cc:useGuidelines"
    • resource="http://www.europeana.eu/rights/pd-usage-guide/"
    This becomes the href of the "Non-binding use guidelines apply to this work" text.

    license rel (url)

    The actual link to the rights page should have a rel attribute:
    • rel="xhv:license http://www.europeana.eu/schemas/edm/rights"
    Nothing works without xhv:license.

    Test

    warning

    Keep an eye on the net tab when you open the link - it can time-out contacting scraper.creativecommons.org.

    link

    Here's a working test link to a rights page. If this is being read from a publicly available server then the above link will contain the text "Non-binding use guidelines apply to this work." and other data scraped from this page.

    other

    Other metadata used in the old portal included:
    • rdfs:seeAlso
    • cc:morePermissions
    • TODO: find them all
    but that is not used here.

    User Requests Table

    ID User email Organization Request Date Request Type Request Status
    1 alena.fedasenka@europeana.eu Europeana 15-02-2017 Add Pending
    2 yorgos.mamakis@europeana.eu BNF 14-02-2017 Delete Rejected
    1 cecile.devarenne@europeana.eu Europeana 15-01-2017 Add Accepted

    Table Bordered

    Table Heading 1 Table Heading 2 Table Heading 3 Table Heading 3 Table Heading 4
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5

    Table Horizontal

    Table Heading 1 Table Heading 2 Table Heading 3 Table Heading 3 Table Heading 4
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5

    Table Responsive Break

    Table Heading 1 Table Heading 2 Table Heading 3 Table Heading 4 Table Heading 5
    Row Heading 1 Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4
    Row Heading 2 Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4
    Row Heading 3 Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4
    Row Heading 4 Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4

    Table Responsive

    Table Heading 1 Table Heading 2 Table Heading 3 Table Heading 3 Table Heading 4
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5
    Table Heading 1 Table Heading 2 Table Heading 3 Table Heading 3 Table Heading 4
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5

    Table Striped

    Table Heading 1 Table Heading 2 Table Heading 3 Table Heading 3 Table Heading 4
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5

    Table

    Table Heading 1 Table Heading 2 Table Heading 3 Table Heading 3 Table Heading 4
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5
    Table Cell 1 Table Cell 2 Table Cell 3 Table Cell 4 Table Cell 5

    Blockquote

    A block quotation (also known as a long quotation or extract) is a quotation in a written document, that is set off from the main text as a paragraph, or block of text, and typically distinguished visually using indentation and a different typeface or smaller size quotation.

    Caption

    A caption can be applied to an image, quote, form field, etc.

    Clicktip

    Here is some text

    Code Sample

    
    	function foo($arg_1, $arg_2, /* ..., */ $arg_n)
    	{
    	    echo "Example function.\n";
    	    return $retval;
    	}
    
    

    Dropcap

    So, setting about it as methodically as men might smoke out a wasps' nest, the Martians spread this strange stifling vapour over the Londonward country. The horns of the crescent slowly moved apart, until at last they formed a line from Hanwell to Coombe and Malden. All night through their destructive tubes advanced.

    Emphasis Colors

    This is what error text looks like

    This is what valid text looks like

    This is what warning text looks like

    This is what information text looks like.

    Headings

    Heading Level 1

    Heading Level 2

    Heading Level 3

    Heading Level 4

    Heading Level 5
    Heading Level 6

    h1 Heading Giga

    h1 Heading Mega

    h1 Heading Alpha

    Heading Beta

    Heading Gamma

    Heading Delta

    Heading Epsilon
    Heading Zeta

    Heading 1 with link

    Heading 2 with link

    Heading 3 with link

    Heading 4 with link

    Heading 5 with link
    Heading 6 with link

    Heading Level 1

    Heading Level 2

    Heading Level 3

    Heading Level 4

    Heading Level 5
    Heading Level 6

    Hr


    Inline Elements

    This is a text link

    Strong is used to indicate strong importance

    This text has added emphasis

    The b element is stylistically different text from normal text, without any special importance

    The i element is text that is set off from the normal text

    The u element is text with an unarticulated, though explicitly rendered, non-textual annotation

    This text is deleted and This text is inserted

    This text has a strikethrough

    Superscript®

    Subscript for things like H2O

    This small text is small for for fine print, etc.

    Abbreviation: HTML

    Keybord input: Cmd

    This text is a short inline quotation

    This is a citation

    The dfn element indicates a definition.

    The mark element indicates a highlight

    This is what inline code looks like.

    This is sample output from a computer program

    The variable element, such as x = y

    Paragraph

    So, setting about it as methodically as men might smoke out a wasps' nest, the Martians spread this strange stifling vapour over the Londonward country. The horns of the crescent slowly moved apart, until at last they formed a line from Hanwell to Coombe and Malden. All night through their destructive tubes advanced.

    Preformatted Text

      	
    P R E F O R M A T T E D T E X T
    ! " # $ % & ' ( ) * + , - . /
    0 1 2 3 4 5 6 7 8 9 : ; < = > ?
    @ A B C D E F G H I J K L M N O
    P Q R S T U V W X Y Z [ \ ] ^ _
    ` a b c d e f g h i j k l m n o
    p q r s t u v w x y z { | } ~ 
    

    Quote

    Three D

    Text looks better

    When it's 3D text

    Time

    Tooltip

    This is the text
    This is the tooltip

    Tooltip Persistent

    This is the text
    This is the tooltip

    Tooltip Trailing

    This is the text
    This is the tooltip

    Welcome Message

    Welcome Cecile, let's ingest a world of Culture!

    Debug

    Fullscreen Detect

    Fullscreen Desktop Application

    My web page with desktop fullscreen feature

    Block Content Header

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. (72 characters)

    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam

    Block Hero

    Block Thumb

    Browse Entry More

    Browse Entry

    Opera

    Event Block Small

    10:00 — 22:00

    Lorem ipsum dolor sit amet, consectetur adipiscing elit

    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam

    Headline Byline

    Headline Only

    Inset Block

    Labs Item Main

    Lorem ipsum dolor sit (37 characters)

    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam

    Labs Item

    Listitem Simple

    Lorem ipsum dolor sit amet, consectetur adipiscing elit

    Lorem ipsum dolor sit amet, consectetur adipiscing elit

    So, setting about it as methodically as men might smoke out a wasps' nest, the Martians spread this strange stifling vapour over the Londonward country. The horns of the crescent slowly moved apart, until at last they formed a line from Hanwell to Coombe and Malden. All night through their destructive tubes advanced.

    Media Block

    Media Item Video

    Queso caerphilly cheesecake. Parmesan chalk and cheese port-salut port-salut babybel cottage cheese cheesy grin pepper jack. Croque monsieur paneer st. agur blue cheese emmental.

    Media Item

    Person Block Small Partners

    Organisation | Institute Name
    Job Title
    Europeana Foundation Board Position

    Person Block Small

    Lorem ipsum dolor sit amet, consectetur adipisicing elit

    Person Block Wide

    Lorem ipsum dolor sit amet, consectetur adipisicing elit
    "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."

    Promo Module

    Promo Module External

    Display Number

    Number of statistics that are false:
    95%
    Increase of 35%
    Decrease of 35%

    Pykchart

    Lorem ipsum dolor sit amet, consectetur adipiscing elit

    Accordion Tabs

    • Tab Item

      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras tincidunt pellentesque lorem, id suscipit dolor rutrum id. Morbi facilisis porta volutpat. Fusce adipiscing, mauris quis congue tincidunt, sapien purus suscipit odio, quis dictum odio tortor in sem. Ut sit amet libero nec orci mattis fringilla. Praesent eu ipsum in sapien tincidunt molestie sed ut magna. Nam accumsan dui at orci rhoncus pharetra tincidunt elit ullamcorper. Sed ac mauris ipsum. Nullam imperdiet sapien id purus pretium id aliquam mi ullamcorper.

    • Another Tab

      Ut laoreet augue et neque pretium non sagittis nibh pulvinar. Etiam ornare tincidunt orci quis ultrices. Pellentesque ac sapien ac purus gravida ullamcorper. Duis rhoncus sodales lacus, vitae adipiscing tellus pharetra sed. Praesent bibendum lacus quis metus condimentum ac accumsan orci vulputate. Aenean fringilla massa vitae metus facilisis congue. Morbi placerat eros ac sapien semper pulvinar. Vestibulum facilisis, ligula a molestie venenatis, metus justo ullamcorper ipsum, congue aliquet dolor tortor eu neque. Sed imperdiet, nibh ut vestibulum tempor, nibh dui volutpat lacus, vel gravida magna justo sit amet quam. Quisque tincidunt ligula at nisl imperdiet sagittis. Morbi rutrum tempor arcu, non ultrices sem semper a. Aliquam quis sem mi.

    • Third

      Donec mattis mauris gravida metus laoreet non rutrum sem viverra. Aenean nibh libero, viverra vel vestibulum in, porttitor ut sapien. Phasellus tempor lorem id justo ornare tincidunt. Nulla faucibus, purus eu placerat fermentum, velit mi iaculis nunc, bibendum tincidunt ipsum justo eu mauris. Nulla facilisi. Vestibulum vel lectus ac purus tempus suscipit nec sit amet eros. Nullam fringilla, enim eu lobortis dapibus, quam magna tincidunt nibh, sit amet imperdiet dolor justo congue turpis.

    • Last Item

      Sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Phasellus dui urna.

    Accordion

    • Accordion 1
      Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa maxime odit reiciendis nostrum animi amet! Commodi impedit adipisci, accusamus aut consequatur architecto aliquid minima fuga id, necessitatibus, mollitia maxime vel!
    • Accordion 2
      Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa maxime odit reiciendis nostrum animi amet! Commodi impedit adipisci, accusamus aut consequatur architecto aliquid minima fuga id, necessitatibus, mollitia maxime vel!
    • Accordion 3
      Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa maxime odit reiciendis nostrum animi amet! Commodi impedit adipisci, accusamus aut consequatur architecto aliquid minima fuga id, necessitatibus, mollitia maxime vel!

    Cart Mini

    Comment

    So, setting about it as methodically as men might smoke out a wasps' nest, the Martians spread this strange stifling vapour over the Londonward country. The horns of the crescent slowly moved apart, until at last they formed a line from Hanwell to Coombe and Malden. All night through their destructive tubes advanced.

    Iiif Transcription Js

    [[#transcript]]

    [[#words]] [[txt]] [[#space-after]]
    [[/space-after]] [[/words]]

    [[/transcript]]

    Iiif

    << >>

    Media Nav Item

    Media Nav

    Midi

    Oembed

    Pdfjs Ui Inner

    Current View

    Pdfjs Ui Thumbs Left

    Current View

    Pdfjs Ui Thumbs Right

    Current View

    Pdfjs

        page: /

    Photoswipe

    Contact Form

    Hold Ctrl to multi-select

    Event Date

    10:00 — 22:00

    File Browser

    File List Moredata

    File List Small

    Help Contact

    Lorem ipsum dolor sit amet, consectetur adipiscing elit

    Firsty Surnameson
    Contact:
    Firsty Surnameson
    01234 5678910

    Pro Listitem

  • Lorem ipsum dolor sit amet, consectetur adipiscing elit. (72 characters)

    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
  • Thumbnails

    Lorem ipsum dolor sit amet, consectetur adipiscing elit

    Channel Object Suggestion Js

    Search Blog List Item

    So, setting about it as methodically as men might smoke out a wasps' nest, the Martians spread this strange stifling vapour over the Londonward country. The horns of the crescent slowly moved apart, until at last they formed a line from Hanwell to Coombe and Malden. All night through their destructive tubes advanced.

    Search Event List Item

    So, setting about it as methodically as men might smoke out a wasps' nest, the Martians spread this strange stifling vapour over the Londonward country. The horns of the crescent slowly moved apart, until at last they formed a line from Hanwell to Coombe and Malden. All night through their destructive tubes advanced.

    Search Form Navbar

    Search Form

    Search Listitem Federated Js

    Search Listitem Js

    [[^ img.src ]]
    [[>molecules/components/search/_search-listitem-icon-js]]
    [[/ img.src ]]

    [[ title ]] [[#year.long]]([[ year.long ]])[[/year.long]][[#agent]] | [[ agent ]][[/agent]]

    [[#agent]]

    [[ . ]]

    [[/agent]] [[#text]]

    [[text.medium]]

    [[/text]] [[#concepts]]
      [[#items]]
    • [[text]]
    • [[/items]]
    [[/concepts]] [[#origin]] [[#url]] [[/url]] [[/origin]]
    [[# menus.actions_disabled ]] [[/ menus.actions_disabled ]]
    [[#agent]][[.]][[/agent]][[^agent]]
    [[/agent]]

    Search Listitem

    Star Rating Display

    stars

    Thumb Icon

    Tooltip Icon

    Videojs

    Videojs Flac

    Videojs Flv

    Videojs Mp3

    Videojs Mp4

    Videojs Mpg

    Videojs Mpga

    Videojs Ogv

    Videojs Wav

    Videojs Wmv

    Videojs X Flac

    Attribution Widget

    Buttonbar Viewtype

    Colour Search Template

    Dropdown Menu

    Filter Advanced

    Filter Boolean

    Filter Colour

    Filter Date

    Filter Hierarchical

    Filter Hierarchical Rights

    Filter Mobile Summary

    Filter Simple

    Filter Tabbed

    Group Checkbox

    My Checkbox list title

    Payment Method

    Share Social

    Star Rating

    Comment Form

    Feedback

    Filterby

    Metis Dataset Info

    Newsletter

    Sign up for our newsletter

    Search Item Navigation

    Sortby

    Licenses Js

    [[#license_CC0]] [[license_name]] [[^license_name]] CC0 [[/license_name]] [[/license_CC0]] [[#license_CC_BY]] [[license_name]] [[^license_name]] CC BY [[/license_name]] [[/license_CC_BY]] [[#license_CC_BY_SA]] [[license_name]] [[^license_name]] CC BY-SA [[/license_name]] [[/license_CC_BY_SA]] [[#license_CC_BY_ND]] [[license_name]] [[^license_name]] CC BY-ND [[/license_name]] [[/license_CC_BY_ND]] [[#license_CC_BY_NC]] [[license_name]] [[^license_name]] CC BY-NC [[/license_name]] [[/license_CC_BY_NC]] [[#license_CC_BY_NC_SA]] [[license_name]] [[^license_name]] CC BY-NC-SA[[/license_name]] [[/license_CC_BY_NC_SA]] [[#license_CC_BY_NC_ND]] [[license_name]] [[^license_name]] CC BY-NC-ND[[/license_name]] [[/license_CC_BY_NC_ND]] [[#license_OOC]] [[license_name]] [[^license_name]] Out of Copyright [[/license_name]] [[ expiry ]] [[/license_OOC]] [[#license_PD_NC]] [[license_name]] [[^license_name]] Public Domain - non commercial re-use[[/license_name]] [[/license_PD_NC]] [[#license_public]] [[license_name]] [[^license_name]] Public Domain [[/license_name]] [[/license_public]] [[#license_RR_free]] [[license_name]] [[^license_name]] Rights Reserved - Free Access [[/license_name]] [[/license_RR_free]] [[#license_RR_paid]] [[license_name]] [[^license_name]] Rights Reserved - Paid Access [[/license_name]] [[/license_RR_paid]] [[#license_RR_restricted]] [[license_name]] [[^license_name]] Rights Reserved - Restricted Access [[/license_name]] [[/license_RR_restricted]] [[#license_unknown]] [[license_name]] [[^license_name]] Unknown copyright status [[/license_name]] [[/license_unknown]] [[#license_orphan]] [[license_name]] [[^license_name]] Orphan work [[/license_name]] [[/license_orphan]]

    Licenses

    Rel_attribute

    rel="xhv:license http://www.europeana.eu/schemas/edm/rights"

    Fluid Grid

    Grid Examples

    The grid below shows a combination of nested, gutterless, reversed, centered, responsive grids, all using classes in the HTML. Each integer represents the high-level grid item you are looking at, and each decimal represents the grid item’s level of nesting (if any), e.g. Grid 5.3 represents the third nested grid inside of the fifth major grid.

    This is based on CSS Wizardry Grids: See link for docs or the scss file for documentation

    Grid 1.1

    Grid 1.3

    Grid 2.1

    Grid 2.2

    Grid 2.3

    Grid 2.4

    Grid 2.5

    Grid 3.0

    Grid 4.1

    Grid 4.2

    Grid 5.1

    Grid 5.2

    Grid 5.3

    Grid 5.4

    Grid 6.1

    Grid 6.2

    Grid 6.3

    Grid 6.4

    Narrow gutters

    Wide Gutters

    Centered Grid

    Brand Svg Assets

    Figure With Caption

    4x3 Image
    This is an example of an image with a caption. Photo captions, also known as cutlines, are a few lines of text used to explain or elaborate on published photographs.

    Image Compare

    (left) Two people, Vermeer, Rijksmuseum, CC BY-SA | (right) Three people, Vermeer, Rijksmuseum, CC BY-SA

    Ripples_medium

    Ripples_thick

    Ripples_thin

    File Detail

    Download

    Item Author

    By:

    Item Comments

    20 Comments

    Item Date

    10 February 2013

    Item Deadline

    Deadline for applications: 10 February 2013

    Item Department

    Item Email

    mail@provider.com

    Item Location

    Den Haag, Netherlands

    Item Provider

    Provider's Name

    Item Readtime

    20 mins to read

    Item Tags

    Item Website

    www.provider.com

    Meta RSS

    Meta Daterange

    10 February 2013 to: 10 February 2013

    Meta Email

    Meta Phone Mobile

    +1.888.123.4567

    Meta Phone Work

    +1.888.123.4567

    Breadcrumbs

    Colour Palette

    E7a1418 Nav

    Foldable List

    Global Topdrawer

    Next Previous