/*
 * Inherit from the top level workshop stlye sheet.
 */
@import url(../workshop.css);

/*
 * <span class="statusi">TODO</div> is used to mark unfinished work.
 */
.status {
    font-size: large;
    folt-weight: bold;
    color: red;
    text-align: center;
    padding: 0 3ex 0 3ex;
}

/*
 * <xxx class="floatright"> makes a right-aligned image with text free
 * to flow around it.  This is like <img align="right" border="0">,
 * but we also add a margin, to prevent the text from bumping into the
 * image.
 */
.floatright {
    float: right;
    padding: 0;
    border: 0;
    margin: 20px;
}

/*
 * <xxx class="fixedbottomright"> anchors an element to the bottom
 * right corner of the display (not scrolling).  It falls back
 * to anchoring the element to the bottom right corner of the document
 * (scrolling) if the browser does not support the CSS2 "position:
 * fixed" declaration but does support "position: absolute".  It falls
 * back to simply floating the element to the right if the browser
 * does not support "position" at all.
 */
.fixedbottomright {
    border: 0;
    position: absolute;	/* scrolls with document */
    left: auto;
    bottom: 0;
    right: 0;
    width: auto;
    height: auto;
    float: right;	/* to help CSS1 browsers */
}
.fixedbottomright {
    position: fixed;	/* fixed to window, not scrolling */
}

/*
 * We use the following elements to make the detailed timetable:
 * <ul class="topics">.
 *
 * Increase the font size for the top level <li>, but not for
 * lower-level <li>.
 */
ul.topics li {
    font-size: large;
    font-weight: bold;
}
ul.topics li li {
    font-size: medium;
    font-weight: normal;
}

/*
 * We use the following elements to make the summary timetable:
 * <table class="timetable">, <td class="day">, <th class="time">,
 * <td class="empty">, <td class="slot">, <div class="topic" id="${tag}">
 */
table.timetable {
    width: 100%;
}
table.timetable tr td,
table.timetable tr th {
    font-size: medium;
    text-align: left;
    vertical-align: top;
    border: thin solid black;
    padding: 0.5ex;
}
table.timetable .empty {
    border: 0;
}
table.timetable .day {
    /* background-color: #D9D9D9; */
    font-size: large;
    font-weight: bold;
    vertical-align: middle;
    text-align: center;
    padding: 1ex;
}
table.timetable .time {
    /* background-color: #D9D9D9; */
    font-size: large;
    font-weight: bold;
    vertical-align: middle;
    text-align: left;
}
table.timetable .topic {
    padding: 1ex 0 1ex 0;
}