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

/*
 * <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 timetable:
 * <table class="timetable">, <td class="day">, <th class="time">,
 * <td class="empty">, <td class="slot">
 */
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: top;
    text-align: left;
    padding: 1ex;
}
table.timetable .time {
    /* background-color: #D9D9D9; */
    font-size: large;
    font-weight: bold;
    vertical-align: middle;
    text-align: center;
}