/* BEGIN marginaalit */
body {
    font-family: sans-serif;
}

#toc {
	margin-bottom: 5em;
}

h2 {
	margin-top: 3em;
}

h3 {
	margin-top: 1.7em;
}

h3 {
	margin-left: 1em;
}

p {
	margin-left: 1.3em;
}

h4 {
	margin-left: 3em;
}

h4+pre {
	margin-top: -1em;
	margin-left: 3.6em;
	margin-bottom: 2em;
}

h4+ul {
	margin-top: -0.5em;
	margin-left: 1.4em;
	margin-bottom: 2em;
}

pre {
	margin-left: 1.6em;
}

h5 {
	margin-left: 3em;
}

/* END marginaalit */

code {
	background-color: #ffffff;
}

pre {
	border: 1px #000 solid;
	padding: 1em 50em 1em 1em;
	background-color: #ffffff;

	-moz-border-radius: 10px; /* Firefox */
	-webkit-border-radius: 10px; /* Safari, Chrome */
	border-radius: 10px; /* CSS3 */
}

span.tab {
	width: 2em; float: left;
}


span.gray {
	color: gray;
}

.tehtavat {
    border: 1px #000 solid;
    margin: 0.5em;
    padding-right: 1em;
}

.helppo {
    background-color: #e8ffe8;
}

.keskitaso {
    background-color: #e8e8ff;
}

.rounded-corners {
    -moz-border-radius: 10px; /* Firefox */
    -webkit-border-radius: 10px; /* Safari, Chrome */
    border-radius: 10px; /* CSS3 */
}

hr:before {
    margin-top: 20px;
}

hr {

    margin-top: 40px;
    padding: 0;
    border: none;
    width: 80%;
    border-top: medium double #000;
    color: #000;
    text-align: center;
}

hr:after {
    content: "~$~";
    display: inline-block;
    position: relative; 
    top: -0.7em;  
    font-size: 1.5em;
    background-color: #e8ffe8;
    padding: 0 0.5em;
}