style.css

@import url('https://fonts.googleapis.com/css?family=Roboto:400,400i,500,700');
body {
    font-family: 'Roboto', sans-serif;
    color: #333;
    line-height: 1.4;
    word-spacing: 2px;
    margin: 0;
    font-size: 87.5%;
} @media print {
	body {
		color: black;
	}
}
#page {
    margin: auto;
    max-width: 1200px;
    padding: 1em;
    position: relative;
}
img {
	max-width: 100%;
}

/********** Table **********/
table {
    width: 100%;
    margin: 1em 0 1em;
    border-collapse: collapse;
}
th, td {
    border: 1px solid grey;
    padding: .1em;
    padding: .2em .5em .2em;
    vertical-align: top;
} th {
    width: 6.5em;
    text-align: left;
    background-color: whitesmoke;
    vertical-align: middle;
    font-weight: 500;
} td>* {
	margin: 0;
}

/********** Headings **********/
h1, h2 {
	margin: 1.5em 0 .7em;
	letter-spacing: -1px;
    word-spacing: normal;
    font-weight: 500;
}
header h1 {
    font-size: 3em;
    line-height: normal;
} header h1:before {
    content: none;
}

/********** Input **********/
input, textarea {
    width: 100%;
    box-sizing: border-box;
    border: none;
    font-size: inherit;
    color: inherit;
    background-color: transparent;
}
input:hover:not([disabled]), textarea:hover:not([disabled])) {
    background-color:whitesmoke;
}
input:invalid, .ng-invalid {
	background-color: #f2c3c3;
}

/********** Input **********/
code {
    tab-size: 2;
    word-spacing: 0;
/*} @media print { code {*/
	/* Prevent to cut off */
    white-space: pre-wrap;
    word-break: break-all; /*even words*/
    max-height: none;
}/*}*/

.hljs {
	background-color: transparent;
	padding: 0;
}

/********** Table of contents **********/
#toc {
    background: whitesmoke;
    padding: 1em 2em 2em;
} #toc ul {
    list-style: none;
    padding: 0;
} #toc li {
    cursor: pointer;
} #toc .toc1 {
    font-weight: 500;
} #toc h2:before {
    content: none;
}
@media (min-width: 960px) {
    #toc {
        margin: 1em;
        float: right;
        max-width: 500px;
    }
}

/********** Heading Numbering **********/
body, .toc-supervised { counter-reset: h1counter h2counter h3counter h4counter
    h5counter h6counter; }
h1:before, .toc1:before {
    content: counter(h1counter) "\0000a0\0000a0";
    counter-increment: h1counter;
} h1, toc1 {counter-reset: h2counter h3counter h4counter h5counter h6counter;
}
h2:before, .toc2:before {
    content: counter(h1counter) "." counter(h2counter) "\0000a0\0000a0";
    counter-increment: h2counter;
} h2, toc2 {counter-reset: h3counter h4counter h5counter h6counter;
}
h3:before, .toc3:before {
    content: counter(h1counter) "." counter(h2counter) "." counter(h3counter)
        "\0000a0\0000a0";
    counter-increment: h3counter;
} h3, toc3 {counter-reset: h4counter h5counter h6counter;
}
h4:before, .toc4:before {
    content: counter(h1counter) "." counter(h2counter) "." counter(h3counter)
        "." counter(h4counter)  "\0000a0\0000a0";
    counter-increment: h4counter;
} h4, toc4 {counter-reset: h5counter h6counter;
}
h5:before, .toc5:before {
    content: counter(h1counter) "." counter(h2counter) "." counter(h3counter)
        "." counter(h4counter) "." counter(h5counter)  "\0000a0\0000a0";
    counter-increment: h5counter;
} h5, toc5 {counter-reset: h6counter;
}
h6:before, .toc6:before {
    content: counter(h1counter) "." counter(h2counter) "." counter(h3counter)
        "." counter(h4counter) "." counter(h5counter) "." counter(h6counter)
        "\0000a0\0000a0";
    counter-increment: h6counter;
}