example/src/style/default.css


body {
    font-family: Optima, Linux Biolinum, Candara, sans-serif;
    background: #ffffff; 
    color: #000000;   
    margin: 10px 40px 40px 40px;
    max-width: 80ex;
    text-align: left;
}


a 		    { color: #3399ee; text-decoration: none;  }
a:link		{ color: #3399ee;  }
a:visited	{ color: #2288dd;  }
a:active	{ color: #2288dd;  }
a:hover		{ color: #2288dd;  }

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .header a
{ text-decoration: none; }


h1 {
    margin: 1em 0em;
    /*color: #45a9b0;*/
    border-bottom: 1px solid #000000;
    font-weight: bolder;
    color: #000000;
    font-size: xx-large;
    /*font-variant: small-caps;*/
    text-align: left;
}

h2, .inlinepage h1 {
    /*color: #84c7c0;*/
    color: #3399ee;
    margin-bottom: 1em;
    margin-top: 1.5em;
    padding: 0;
    /*text-transform: uppercase;*/
    font-size: large;
    font-variant: normal;
    font-weight: bolder;
}

h3, h4, h5, h6 {
	margin-top: 1em;
	margin-bottom: 0.05em;
	font-size: medium;
	color: #ffffff;
}

blockquote {
    /*font-style: italic;*/
    padding: 0 1ex;
    border-left: 1px solid #3399ee;
}

blockquote p {
    margin: 0.9ex 0;
}

blockquote em {
    font-style: normal;
}

pre {
    /*background-color: #a0a0a0;*/
    padding: 0 1ex;
    border-left: 2px dashed #3399ee;
}

hr {
    border: none 0;
    border-top: 2px dashed #84c7c0;
    height: 1px;
    width: 10ex;
    margin: 1ex auto 1ex 0;
}

table {
    /*border: none 0;*/
    border-collapse: collapse;
    padding: 0.5ex;
}

thead {
 border-bottom: 2px dashed #84c7c0;
}

tr, td {
    border: 0px solid #aaaac0;
    padding: 0ex 1ex;
}

table[border="1"] tr, table[border="1"] tr td {
    border: 1px solid #aaaac0;
}


key {
    font-family: monospace;
}

code {
    font-family: monospace;
    font-size: medium;
}

li {
 margin-top: 1em;
}

.illustr-left {
    float: left;
    padding-right: 1ex;
    padding-bottom: 1ex;
    padding-top: 1ex;
}

.illustr-right {
    float: right;
    padding-left: 1ex;
    padding-bottom: 1ex;
    padding-top: 1ex;
}

b{
    font-weight: bolder;
}

.bibtex2html td {
    padding-bottom: 5px ;
}

.bibtex2html .bibtexitem .me {
   font-style: normal;
}

.bibtex2html .bibtexitem .author {
   font-style: normal;
   font-variant: small-caps;
}

img.copy-cc {
  height: 1em;
  margin: 1pt;
  padding-right: 1pt;
  margin-top: 4pt;
  padding-top: 2pt;
}

/* main */

body {
	margin: 0;
	padding: 0;
    max-width: none;
    background-image: url('banner2x.jpg');
    background-repeat: no-repeat;
    background-size: 100%;
}

body> .header {
	margin: 0px;
    margin-left: 60px;
    padding: 120px 0px 20px 0px;
    font-size: large;
    font-weight: bolder;
    line-height: 1em;
    display: block;
    /*height: 130px;*/
}

body> .header a,
body> .header a:link,
body> .header a:visited,
body> .header a:active,
body> .header a:hover {
	/*color: #3377ee;*/
    color: #000000;
    text-decoration: none;
}


#content {
    margin: 0;
    padding: 0;
    margin-left: auto;/*30ex;*/
    margin-right: auto;/*10ex;*/
    max-width: 80ex;
    text-align: left;
    display: block;
}

#sidebar {
    line-height: 3ex;
    float: left;
    margin: 0;
    max-width: 50ex;
    padding: 4ex 0px;
    margin-left: 8ex;
    padding-top: 2ex;
    line-height: 150%;
}

.sidetitle {
    color: #000000;
    margin-top: 3ex;
    font-weight: bolder;
}

.side {
    padding-left: 1.5ex;
    text-align: left;
    font-size: medium; /* feed to compliant browsers */
}

@media screen and (max-width: 140ex) {

    body> .header {
        padding: 0px;
    }

    .side {
        padding-top: 2ex;
        text-align: left;
        /*font-size: x-large; 
        line-height: 300%;*/
     }

    #sidebar {
        margin-left: 8ex;
        padding: 0ex 2ex;
        float: none;
    }

    #content {
        margin-left: 8ex;
        margin-right: 8ex;
        padding: 0ex 2ex;
        /*max-width: none;*/
        display: block;
    }
}

@media screen and (max-device-width: 480px) {
    .side {
        font-size: large;
        line-height: 200%;
    }

    #sidebar {
        margin-left: 1ex;
        font-size: large;
    }

    #content {
        margin-left: 1ex;
        margin-right: 1ex;
    }
}

.extra {
    color: #ffffff !important;
    display: inline;
}

.extra a {
    color: #ffffff !important;
}

#sidebar a {
    text-decoration: none;
    font-weight: bolder;
    color: #3388ee;
}

#sidebar ul {
    list-style-type: none;
}

#sidebar LI {
    display: block;
}

.inlinepage {
	padding: 0px 0px;
	border: none;
	/*border-top: 1px solid #aaaac0;*/
    padding-top: 2ex;
    margin-top: 2ex;
    margin-bottom: 4ex;
}

.inlinepage .header {
    color: red;
    font-size: large;
    font-weight: bolder;
    text-transform: uppercase;
}

.posted-header {
	color: #000;
	margin-bottom: 10x;
	text-align: left;
	line-height: 1.7em;
	font-weight: bolder;
	/*font-size: small;*/ /* for compliant browsers */
	border-bottom: 1px solid #000000;
}

.posted {
}

body> #footer .tags {
    margin: 1em 0ex;
}

body> #footer #backlinks {
    margin: 1em 0ex;
}

body> #footer .pageinfo {
    margin: 1em 0ex;
}

body> #footer {
	padding: 4ex 0ex;
    margin: 1em 0ex;
    clear: both;
}

.pageinfo {
	clear: both;
	font-style: italic;
	display: block;
}

/* Orange feed button. */
.feedbutton {
	background: #ff6600;
	color: white !important;
	border-left: 1px solid #cc9966;
	border-top: 1px solid #ccaa99;
	border-right: 1px solid #993300;
	border-bottom: 1px solid #331100;
	padding: 0px 0.5em 0px 0.5em;
	font-weight: bolder;
	/*font-size: small;*/
	text-decoration: none;
	margin-top: 1em;
}
.feedbutton:hover {
	color: white !important;
	background: #ff9900;
}

.katex { font-size: normal; }