@CHARSET "UTF-8";

body
{
    font-family      : sans-serif;
    background-color : snow;
    color            : blue;
    margin           : 10px;
    padding          : 10px;
}

footer
{
    font-size   : x-small;
    position    : absolute;
    bottom      : 0px;
    width       : 100%;
    text-align  : center;
}

header
{
    position         : relative;
    text-align       : center;
    width            : 60%;
    left             : 20%;          /* so as to center horizontally... */
    border-radius    : 10px;
    background-color : blue;
    color            : white;
    padding          : 0.4em;
    font-weight      : bold;
}

a
{
    color           : grey;
    font-style      : oblique;
    text-decoration : overline underline;
    font-variant    : small-caps;
    transition : color 0.25s ease-in-out;
}

a:hover
{
    color      : orange;
    transition : color 0.25s ease-in-out;
}

div#portfolio
{
    position        : relative;
    display         :table;
    margin-left     : auto;
    margin-right    : auto;
    text-align: center;
}

div#portfolio a div.caption
{
    position          : relative;
    bottom            : 25px;
    transition        : all 0.5s linear;
    visibility        : hidden;
}

div#portfolio:hover a div.caption
{
    position          : relative;
    visibility        : visible;
    bottom            : 0px;
    transition        : all 0.25s linear;
}