style.scss

$enable-gradients:true;

body {
    background: url('images/back.jpg') no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

// .space configuration -----------------------

$bigwid: 1000px;
$smallwid: 700px;
$uppermargin: 0;
$bgcolor: lightblue;

.space {
    background-color: $bgcolor;
    font-size: 14pt;
    font-family: Verdana;
    padding-bottom: 20pt;
}

@media only screen and (min-width: $bigwid) {
    .space {
        margin: $uppermargin 15%;
    }
}

@media only screen and (max-width: $bigwid) and (min-width: $smallwid) {
    .space {
        margin: $uppermargin 10%;
    }
}

@media only screen and (max-width: $smallwid) {
    .space {
        margin: 0;
    }
}

//other elements ------------------------------

%innermargin {
    margin: 20pt;
}

table {
    border-collapse: collapse;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    border-width: 0 2pt;
    border-style: solid;
    border-color: blue;

    th, td {
        border-width: 2pt 0;
        border-style: solid;
        border-color: blue;
        padding: 3pt;
    }

    th {
        background-color: rgb(150, 196, 218);
        font-size: 14pt;
        font-weight: bold;
    }

    td {
        background-color: rgb(212, 232, 233);
    }

    #TE, #TM {
        font-size: 14pt;
    }
}

p {
    @extend %innermargin;
    text-align: justify;
    font-size: 14pt;
}

ol {
    @extend %innermargin;
}

h1, h2 {
    text-align: center;
}

.image {
    @extend %innermargin;

    img {
        border-radius: 15pt;
        width: 60%;
        background-color: white;
    }
}

.box {
    @extend %innermargin;
    background-color: rgb(134, 180, 240);
    color: darkblue;
    padding: 10pt;
    border-radius: 5pt;
}

.card {
    margin-top: 5pt;
    margin-bottom: 15pt;
    text-align: center;
}