patrick@67: @charset "UTF-8";
patrick@67: 
patrick@59: /* $Id$ */
patrick@59: 
patrick@71: @import url(xxe-config:common/css/cals_table.imp);
patrick@71: 
patrick@60: *::comment { display: none; }
patrick@60: 
patrick@61: publidoc {
patrick@63:   display: block;
patrick@61:   font-family: sans-serif;
patrick@61:   padding: 0;
patrick@61: }
patrick@60: 
patrick@60: 
patrick@60: /* Head level ============================================================== */
patrick@60: 
patrick@61: head {
patrick@63:   display: block;
patrick@61:   margin-bottom: .5em;
patrick@62:   background-color: #fafafa;
patrick@111:   padding: .2em .5em 0 .5em;
patrick@61:   border: 1px solid #bbbbbb;
patrick@61:   border-radius: 0.2em;
patrick@59: }
patrick@59: 
patrick@60: head > *:before {
patrick@60:  display: marker;
patrick@65:  color:  #7f7f7f;
patrick@70:  content: element-label() " :";
patrick@60: }
patrick@60: head > title:before { display: none; }
patrick@63: head > subtitle:before { display: none; }
patrick@62: head > identifier[type="uri"]:before { content: insert-before-button() " URI :"; }
patrick@62: head > identifier[type="ean"]:before { content: insert-before-button() " EAN :"; }
patrick@61: head > copyright:before { content: insert-before-button() " Copyright :"; }
patrick@67: head > contributors:before { content: insert-before-button() " Contributeurs :"; }
patrick@60: head > date:before { content: insert-before-button() " Date :"; }
patrick@60: head > place:before { content: insert-before-button() " Lieu :"; }
patrick@60: head > source:before { content: insert-before-button() " Source :"; }
patrick@60: head > keywordset:before { content: insert-before-button() " Mots clés :"; }
patrick@61: head > subjectset:before { content: insert-before-button() " Thèmes :"; }
patrick@61: head > abstract:before { content: insert-before-button() " Résumé :"; }
patrick@61: head > cover:before { content: insert-before-button() " Couverture :"; }
patrick@61: head > annotation:before { content: insert-before-button() " Annotation :"; }
patrick@111: head > audio:before { content: insert-before-button() " Audio :"; }
patrick@59: 
patrick@60: head > * {
patrick@60:  display: block;
patrick@67:  margin: 0 0 .8em 7.5em;
patrick@60: }
patrick@67: 
patrick@67: head > *:after {
patrick@67:   color:  #7f7f7f;
patrick@67:   content: " " insert-after-button();
patrick@67: }
patrick@67: 
patrick@67: /* title & subtitle ~~~~~~~~~~~~~~~~ */
patrick@67: 
patrick@60: head > title {
patrick@63:   font-size: 120%;
patrick@60:   font-weight: bold;
patrick@60:   color: #004080;
patrick@111:   margin: 0 0 .2em 0;
patrick@61: }
patrick@63: head > subtitle {
patrick@63:   font-weight: bold;
patrick@63:   color: #004080;
patrick@63:   margin: 0 0 .2em 0;
patrick@60: }
patrick@60: 
patrick@67: /* contributors ~~~~~~~~~~~~~~~~~~~~ */
patrick@67: 
patrick@67: contributor:before {
patrick@67:   display: marker;
patrick@67:   content: insert-before-button(color, #7f7f7f, icon, icon(left-half-disc))
patrick@67:            insert-after-button(color, #7f7f7f, icon, icon(right-half-disc));
patrick@60: }
patrick@67: contributor {
patrick@67:   display: block;
patrick@67:   margin: 0 0 .2em 24px;
patrick@62: }
patrick@60: 
patrick@67: firstname:after, secondname:after, lastname:after, label:after,
patrick@67: address:after {
patrick@65:   content: insert-after-button(color, #7f7f7f, icon, icon(right-half-disc));
patrick@65: }
patrick@65: 
patrick@67: contributor > link[uri]:after {
patrick@67:   content: " ‣ " text-field(attribute, uri, color, black, font-size, 80%) "]"
patrick@67:            insert-after-button(icon, icon(right-half-disc));
patrick@67: }
patrick@67: contributor > link[idref]:after {
patrick@67:   content: " ‣ " label(attribute, idref, color, black)
patrick@67:            set-attribute-button(attribute, idref) "]"
patrick@67:            insert-after-button(icon, icon(right-half-disc));
patrick@65: }
patrick@65: 
patrick@68: contributor role {
patrick@67:   color: #7f7f7f;
patrick@68:   content: " rôle : " combo-box(element, role, font-size, 75%,
patrick@67:              labels, "auteur\A illustrateur\A éditeur"
patrick@68:              values, "author\A illustrator\A publisher", color, black)
patrick@68:            insert-same-after-button(icon, icon(right-half-disc));
patrick@65: }
patrick@65: 
patrick@67: /* source ~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@67: 
patrick@65: head source[type="book"] {
patrick@65:   display: none;
patrick@65: }
patrick@65: 
patrick@67: /* keyword & subject ~~~~~~~~~~~~~~~ */
patrick@67: 
patrick@65: head keyword:after {
patrick@65:   content: insert-same-after-button(color, #7f7f7f, icon, icon(right-half-disc))
patrick@65:            " ";
patrick@65: }
patrick@65: 
patrick@65: head subject:before {
patrick@65:   color: #7F7f7f;
patrick@65:   content: "ID = " text-field(attribute, id, columns, 10, color, black, font-size, 75%);
patrick@65: }
patrick@65: head subject:after {
patrick@65:   content: insert-same-after-button(color, #7f7f7f, icon, icon(right-half-disc));
patrick@65: }
patrick@65: 
patrick@67: /* annotation ~~~~~~~~~~~~~~~~~~~~~~ */
patrick@67: 
patrick@67: head > annotation:after { content: ""; }
patrick@67: 
patrick@67: 
patrick@60: /* Division level ========================================================== */
patrick@60: 
patrick@61: division:before {
patrick@63:   display: block;
patrick@61:   color: #7f7f7f;
patrick@61:   content: collapser() " " insert-before-button() insert-after-button()
patrick@61:            " Division"
patrick@61: }
patrick@61: 
patrick@61: division {
patrick@61:   display: block;
patrick@61:   border: 1px dotted #7f7f7f;
patrick@61:   padding: 5px;
patrick@61:   margin-bottom: .5em;
patrick@61:   collapsible: yes;
patrick@61:   not-collapsible-head: 1;
patrick@61: }
patrick@61: division:last-child {
patrick@61:   margin-bottom: 0;
patrick@61: }
patrick@61: 
patrick@61: division > head {
patrick@62:   background-color: #ffffee;
patrick@61:   padding: .3em .5em .3em .5em;
patrick@61:   border-radius: 0.5em;
patrick@61: }
patrick@61: 
patrick@61: 
patrick@60: /* Component level ========================================================= */
patrick@60: 
patrick@61: topic:before {
patrick@61:   display: block;
patrick@61:   color: #7f7f7f;
patrick@61:   background-color: #ddddcc;
patrick@63:   border: 1px solid #aeaea0;
patrick@61:   font-weight: bold;
patrick@61:   padding: .5em 5px .5em 5px;
patrick@61:   content: collapser() " " insert-before-button() insert-after-button()
patrick@61:            " " add-attribute-button() " Topic";
patrick@61: }
patrick@61: topic[xml|id]:before {
patrick@61:   content: collapser() " " insert-before-button() insert-after-button()
patrick@62:            " " add-attribute-button() " Topic"
patrick@62:            " – ID = " text-field(attribute, "xml:id", columns, 15, color, black);
patrick@61: }
patrick@61: topic[type]:before {
patrick@61:   content: collapser() " " insert-before-button() insert-after-button()
patrick@62:            " " add-attribute-button() " Topic"
patrick@62:            " – Type = " text-field(attribute, type, columns, 10, color, black);
patrick@61: }
patrick@61: topic[xml|id][type]:before {
patrick@61:   content: collapser() " " insert-before-button() insert-after-button()
patrick@62:            " Topic"
patrick@62:            " – ID = " text-field(attribute, "xml:id", columns, 15, color, black)
patrick@62:            " – Type = " text-field(attribute, type, columns, 10, color, black);
patrick@61: }
patrick@61: 
patrick@61: topic {
patrick@63:   display: block;
patrick@63:   border: 1px solid #aeaea0;
patrick@61:   margin-bottom: .5em;
patrick@61:   padding: 5px;
patrick@61:   collapsible: yes;
patrick@61: }
patrick@61: topic:last-child {
patrick@61:   margin-bottom: 0;
patrick@61: }
patrick@61: 
patrick@61: topic > head {
patrick@62:   background-color: #ffffee;
patrick@61:   padding: .3em .5em .3em .5em;
patrick@61:   border-radius: 0.5em;
patrick@61: }
patrick@61: 
patrick@61: 
patrick@61: /* Top level =============================================================== */
patrick@61: 
patrick@61: publidoc > *:before {
patrick@61:   display: block;
patrick@61:   color: #bbbbbb;
patrick@62:   background: #993333 url('top.png') repeat-x top left;
patrick@61:   font-weight: bold;
patrick@62:   padding: 1.2em 5px 1em 5px;
patrick@61: }
patrick@61: publidoc > document:before {
patrick@67:   content: add-attribute-button() " Document"
patrick@117:            " – ID = " text-field(attribute, "id", columns, 15, color, white);
patrick@67: }
patrick@117: publidoc > document[id][xml|lang]:before {
patrick@67:   content: "Document"
patrick@117:            " – ID = " text-field(attribute, "id", columns, 15, color, white)
patrick@67:            " – Langue principale  = " combo-box(attribute, "xml:lang", font-size, 75%,
patrick@67:              values, "en\A fr\A fr-FR\A es", color, white);
patrick@61: }
patrick@117: publidoc > topic[id]:before {
patrick@67:   content: add-attribute-button() " Topic"
patrick@117:            " – ID = " text-field(attribute, "id", columns, 15, color, white);
patrick@61: }
patrick@61: publidoc > topic[xml|id][type]:before {
patrick@67:   content: add-attribute-button() " Topic"
patrick@117:            " – ID = " text-field(attribute, "id", columns, 15, color, white)
patrick@62:            " – Type = " text-field(attribute, type, columns, 10, color, white);
patrick@61: }
patrick@117: publidoc > topic[id][xml|lang]:before {
patrick@67:   content: add-attribute-button() " Topic"
patrick@117:            " – ID = " text-field(attribute, "id", columns, 15, color, white)
patrick@70:            " – Langue principale = " combo-box(attribute, "xml:lang", font-size, 75%,
patrick@67:              values, "en\A fr\A fr-FR\A es", color, white);
patrick@67: }
patrick@117: publidoc > topic[id][type][xml|lang]:before {
patrick@67:   content: "Topic"
patrick@117:            " – ID = " text-field(attribute, "id", columns, 15, color, white)
patrick@67:            " – Type = " text-field(attribute, type, columns, 10, color, white)
patrick@70:            " – Langue principale = " combo-box(attribute, "xml:lang", font-size, 75%,
patrick@67:              values, "en\A fr\A fr-FR\A es", color, white);
patrick@67: }
patrick@61: 
patrick@61: publidoc > * {
patrick@63:   display: block;
patrick@61:   margin: 5px;
patrick@62:   padding: 0;
patrick@61:   border: 0;
patrick@61: }
patrick@61: 
patrick@61: publidoc > * > head {
patrick@62:   background-color: #ffffee;
patrick@61:   padding: .3em .5em .3em .5em;
patrick@61:   border-radius: 0.5em;
patrick@61: }
patrick@61: 
patrick@63: publidoc > * > head > title {
patrick@63:   font-size: 140%;
patrick@111:   margin: .1em 0 .1em 0;
patrick@63: }
patrick@63: 
patrick@61: 
patrick@60: /* Section level =========================================================== */
patrick@60: 
patrick@62: section:before {
patrick@63:   display: block;
patrick@62:   color: #7f7f7f;
patrick@64:   text-align: left;
patrick@64:   font-style: normal;
patrick@64:   font-size: 75%;
patrick@63:   padding-bottom: 3px;
patrick@63:   content: insert-before-button() add-attribute-button(icon, icon(plus-box));
patrick@62: }
patrick@62: section[type]:before {
patrick@64:   content: insert-before-button() add-attribute-button(icon, icon(plus-box))
patrick@64:            " Type = " text-field(attribute, type, columns, 5, color, black);
patrick@64: }
patrick@64: section[xml|lang]:before {
patrick@64:   content: insert-before-button() add-attribute-button(icon, icon(plus-box))
patrick@64:            " Langue = " text-field(attribute, "xml:lang", columns, 2, color, black);
patrick@64: }
patrick@64: section[type][xml|lang]:before {
patrick@63:   content: insert-before-button()
patrick@64:            " Type = " text-field(attribute, type, columns, 5, color, black)
patrick@64:            " – Langue = " text-field(attribute, "xml:lang", columns, 2, color, black);
patrick@62: }
patrick@63: section section:before {
patrick@63:   margin-left: 1em;
patrick@63: }
patrick@62: 
patrick@61: section {
patrick@61:   display: block;
patrick@61: }
patrick@62: section[type="box"] {
patrick@63:   margin-bottom: .5em;
patrick@62:   padding: 5px;
patrick@62:   background-color: #e8f0f7;
patrick@62:   border-radius: 0.2em;
patrick@62: }
patrick@63: section[type="ex"] { font-style: italic; }
patrick@62: section[type="sign"] { text-align: right; }
patrick@62: 
patrick@62: section section {
patrick@63:   margin-left: 1em;
patrick@62: }
patrick@62: 
patrick@62: section:after {
patrick@62:   color: #7f7f7f;
patrick@62:   content: insert-after-button();
patrick@61: }
patrick@64: section section:after {
patrick@64:   margin-left: 1em;
patrick@64: }
patrick@61: 
patrick@59: 
patrick@60: /* Block level ============================================================= */
patrick@59: 
patrick@62: p:before, speech:before, list:before,
patrick@62: blockquote:before, table:before, media:before {
patrick@63:   display: marker;
patrick@72:   color: #7f7f7f;
patrick@72:   content: insert-before-button(icon, icon(left-half-disc))
patrick@72:            insert-after-button(icon, icon(right-half-disc));
patrick@62: }
patrick@62: 
patrick@62: p, speech, list, blockquote, table, media {
patrick@61:   display: block;
patrick@62:   margin-left: 24px;
patrick@63:   font-size: 115%;
patrick@62:   font-family: serif;
patrick@61: }
patrick@61: 
patrick@67: /* speech ~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@65: 
patrick@65: speaker {
patrick@65:   font-weight: bold;
patrick@65: }
patrick@65: 
patrick@65: stage:before, stage:after {
patrick@65:   color: #7f7f7f;
patrick@65:   content: "(";
patrick@65: }
patrick@65: stage:before {
patrick@65:   content: " (";
patrick@65: }
patrick@65: stage {
patrick@65:   font-style: italic;  
patrick@65: }
patrick@65: stage:after {
patrick@65:   content: ")";
patrick@65: }
patrick@65: 
patrick@63: /* list ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@61: 
patrick@72: list:before {
patrick@72:   content: insert-before-button(color, #7f7f7f, icon, icon(left-half-disc))
patrick@72:            insert-after-button(color, #7f7f7f, icon, icon(right-half-disc))
patrick@72:            command-button(command, "putAttribute", parameter, "type ordered", icon, icon(convert));
patrick@72: }
patrick@72: list[type="ordered"]:before {
patrick@72:   content: insert-before-button(color, #7f7f7f, icon, icon(left-half-disc))
patrick@72:            insert-after-button(color, #7f7f7f, icon, icon(right-half-disc))
patrick@72:            command-button(command, "removeAttribute", parameter, "type", icon, icon(convert));
patrick@72: }
patrick@72: list[type="glossary"]:before {
patrick@72:   content: insert-before-button(color, #7f7f7f, icon, icon(left-half-disc))
patrick@72:            insert-after-button(color, #7f7f7f, icon, icon(right-half-disc));
patrick@72: }
patrick@72: 
patrick@61: list {
patrick@72:   margin: .3em 0 .3em 36px;
patrick@72: }
patrick@72: list[type="glossary"] {
patrick@62:   margin: .3em 0 .3em 24px;
patrick@61: }
patrick@61: 
patrick@63: list > head {
patrick@63:   font-size: 75%;
patrick@63: }
patrick@63: 
patrick@61: item {
patrick@61:   display: list-item;
patrick@61: }
patrick@61: list[type="ordered"] > item {
patrick@61:   list-style-type: decimal;
patrick@72:   list-style-position: inside;
patrick@61: }
patrick@61: 
patrick@63: item:after {
patrick@63:   content: insert-same-after-button(color, #7f7f7f, icon, icon(right-half-disc));
patrick@63: }
patrick@63: 
patrick@72: list:not([type="glossary"]) > item > p:before {
patrick@72:   color: #7f7f7f;
patrick@72:   content: insert-same-before-button(icon, icon(left-half-disc))
patrick@72:            insert-same-after-button(icon, icon(right-half-disc));
patrick@72: }
patrick@72: list:not([type="glossary"]) > item > p {
patrick@72:   display: inline;
patrick@72: }
patrick@72: list:not([type="glossary"]) > item > p:after {
patrick@72:   color: #7f7f7f;  
patrick@72:   content: "\A";
patrick@72: }
patrick@72: 
patrick@61: list[type="glossary"] > item > label {
patrick@61:   font-weight: bold;
patrick@61: }
patrick@61: 
patrick@63: /* blockquote ~~~~~~~~~~~~~~~~~~~~~~ */
patrick@62: 
patrick@72: blockquote { color: #004080; }
patrick@72: 
patrick@62: attribution { font-style: italic; }
patrick@62: 
patrick@64: /* media ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@64: 
patrick@68: media {
patrick@108:   margin-top: .5em;
patrick@108:   margin-bottom: 1em;
patrick@108:   padding: 10px;
patrick@108:   border: 1px dashed #7f7f7f;
patrick@108: }
patrick@108: 
patrick@108: media image, media audio {
patrick@108:   display: block;
patrick@108:   font-family: sans-serif;
patrick@108: }
patrick@111: 
patrick@111: media caption {
patrick@111:   display: block;
patrick@111: }
patrick@111: media caption:after {
patrick@111:   content: insert-after-button(color, #7f7f7f, icon, icon(right-half-disc));
patrick@68: }
patrick@68: 
patrick@111: /* image ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@111: 
patrick@111: cover image {
patrick@111:   content: concatenate("image('Images/", attr(id), ".png', -480, -360, smooth)");
patrick@111: }
patrick@111: 
patrick@111: p image {
patrick@111:   content: concatenate("image('Images/", attr(id), ".png', -64, -48, smooth)");
patrick@108:   vertical-align: middle;
patrick@108: }
patrick@111: 
patrick@111: media image:before {
patrick@111:   display: block;
patrick@111:   text-align: left;
patrick@111:   content: concatenate("image('Images/", attr(id), ".png', -480, -360, smooth)")
patrick@111:            insert-button(color, #7f7f7f, icon, icon(pop-down))
patrick@111:            insert-after-button(color, #7f7f7f, icon, icon(right-half-disc));
patrick@111: }
patrick@111: media image[type="thumbnail"]:before {
patrick@111:   content: concatenate("image('Images/", attr(id), ".png', -128, -96, smooth)")
patrick@111:            insert-button(color, #7f7f7f, icon, icon(pop-down))
patrick@111:            insert-after-button(color, #7f7f7f, icon, icon(right-half-disc));
patrick@108: }
patrick@108: 
patrick@111: tooltip image:before {
patrick@111:   content: "";
patrick@111: }
patrick@111: tooltip > image {
patrick@111:   content: concatenate("image('Images/", attr(id), ".png', -128, -96, smooth)");
patrick@64: }
patrick@64: 
patrick@111: media image {
patrick@111:   margin-bottom: .8em;
patrick@111: }
patrick@111: 
patrick@111: image > copyright {
patrick@111:   display: block;
patrick@111:   font-size: 75%;
patrick@68:   font-style: italic;
patrick@68: }
patrick@111: 
patrick@111: tooltip {
patrick@111:   display: block;
patrick@111:   padding: .5em;
patrick@111:   background-color: #eaffe9;
patrick@111:   border-radius: 1.5em;
patrick@111: }
patrick@111: tooltip > p {
patrick@111:   font-family: sans-serif;
patrick@111:   font-size: 85%;
patrick@111: }
patrick@111: 
patrick@111: /* audio ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@111: 
patrick@111: audio {
patrick@111:   content: text-field(attribute, id, color, black, font-size, 75%)
patrick@111:            " type : " label(attribute, type, color, black) " "
patrick@111:            set-attribute-button(attribute, type, icon, icon(pop-sw), color, black);
patrick@111: }
patrick@111: media audio {
patrick@111:   content: "Audio : " text-field(attribute, id, color, black)
patrick@111:            " type : " label(attribute, type, color, black) " "
patrick@111:            set-attribute-button(attribute, type, icon, icon(pop-sw), color, black);
patrick@108: }
patrick@68: 
patrick@64: 
patrick@60: /* Inline level ============================================================ */
patrick@59: 
patrick@63: /* sup, sub, var ~~~~~~~~~~~~~~~~~~~ */
patrick@62: 
patrick@63: sup { font-family: sans-serif; vertical-align: super; font-size: 75%; }
patrick@63: sub { font-family: sans-serif; vertical-align: sub;   font-size: 75%; }
patrick@63: var { font-family: sans-serif; font-style: italic; }
patrick@63: 
patrick@65: /* date ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@65: 
patrick@65: date[value]:after {
patrick@65:   color: #7f7f7f;
patrick@65:   content: " (" date-picker(attribute, value, columns, 7, color, black, font-size, 75%) ")";
patrick@65: }
patrick@65: head > date[value]:after {
patrick@65:   color: #7f7f7f;
patrick@65:   content: " (" date-picker(attribute, value, columns, 7, color, black, font-size, 75%)
patrick@65:            ") " insert-after-button();
patrick@65: }
patrick@65: 
patrick@70: /* name ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@70: 
patrick@70: name { font-family: sans-serif; color: #004080; }
patrick@70: 
patrick@63: /* note ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@63: 
patrick@63: note:before { font-size: 75%; content: "(Note : "; }
patrick@63: note { font-family: sans-serif; color: #004080; font-size: 75%; }
patrick@63: note:after { font-size: 75%; content: ")"; }
patrick@62: note p { display:inline; }
patrick@62: 
patrick@90: /* foreign ~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@90: 
patrick@90: foreign { font-family: sans-serif; font-style: italic; }
patrick@90: 
patrick@63: /* highlight ~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@63: 
patrick@62: highlight { font-weight: bold; }
patrick@63: 
patrick@89: /* mentioned ~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@89: 
patrick@89: mentioned { font-style: italic; }
patrick@89: 
patrick@68: /* term ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@68: 
patrick@89: term { font-family: sans-serif; }
patrick@68: 
patrick@63: /* link ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@63: 
patrick@63: link:before {
patrick@63:   color: #7f7f7f;
patrick@63:   font-family: sans-serif;
patrick@63:   content: "["
patrick@63: }
patrick@63: 
patrick@63: media link {
patrick@63:   display: block;
patrick@63: }
patrick@63: 
patrick@63: link:after {
patrick@63:   color: #7f7f7f;
patrick@63:   font-family: sans-serif;
patrick@63: }
patrick@63: link[uri]:after {
patrick@63:   content: " ‣ " text-field(attribute, uri, color, black, font-size, 80%) "]";
patrick@63: }
patrick@63: link[idref]:after {
patrick@63:   content: " ‣ " label(attribute, idref, color, black)
patrick@63:            set-attribute-button(attribute, idref) "]";
patrick@63: }
patrick@63: 
patrick@106: /* smil ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@106: 
patrick@106: smil {
patrick@106:   background-color: #ffffc0;
patrick@111:   
patrick@106: }