/* My simple style.  */

span.weak {
    /* https://stackoverflow.com/questions/5459518/in-html-what-is-the-opposite-to-strong */
    color: #555;
    font-weight: lighter;
}

body {
    font-family: sans-serif;
    background-color: #DDD;    
}
header, footer {
    text-align: center;
    background-color: #F5F5F5;
}
footer { margin-top: 10pt; }
header h1 {
    /* This way of placing the logos kind of sucks: since they're part of the
       background, they can be clipped or drawn right below the title,
       thus making the title unreadable.  */
    background: url(DIRO-logo.png) center right no-repeat,
                url(UdeM-logo.png) center left  no-repeat;;
    background-size: 10%, 10%;
    /* Avoid collision between text and background images.  */
    padding-right: 10%;
    padding-left: 10%;
}
h1, h2 {
    background-color: #EEE;
    color: #444;
    padding-right: 5%;
    padding-left: 5%;
}
main {
    margin-left: auto;
    margin-right: auto;
    width: 90%;
}
dl > dt {
    font-weight: bold;
}
table {                         /* Center tables.  */
    margin-left: auto;
    margin-right: auto;
    /* border-collapse: collapse; */
    /* border: 1px solid; */
}

div.side-by-side { overflow: auto; }
div.side-by-side div.left { float: left; }
div.side-by-side div.right { float: right; }

/* Like <table cellpadding="3" border="1">  */
table {
    border-width: 1px;
    border-style: solid;
    border-color: #BBB #555 #555 #BBB;
}
td, th {
    padding: 3px;             /* This is the cellpadding="3" part.  */
    border-width: 1px;
    border-style: solid;
    border-color: #555 #BBB #BBB #555;
}

code.block {
    display: block;
    padding-left: 5%;
    padding-top: 4px;
    padding-bottom: 4px;
}
