/* ikiwiki style sheet */

/* Note that instead of modifying this style sheet, you can instead edit
 * local.css and use it to override or change settings in this one.
 */

/* html5 compat */
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
	display: block;
}

.header {
	margin: 0;
	font-size: 140%;
	font-weight: bold;
	line-height: 1em;
	display: block;
}

.inlineheader .author {
	margin: 0;
	font-size: 112%;
	font-weight: bold;
	display: block;
}

.actions ul {
	margin: 0;
	padding: 6px .4em;
	height: 1em;
	list-style-type: none;
}
.actions li {
	display: inline;
	padding: .2em;
}
.pageheader .actions ul {
	border-bottom: 1px solid #000;
}

.inlinepage .actions ul {
	border-bottom: 0;
}

#otherlanguages ul {
	margin: 0;
	padding: 6px;
	list-style-type: none;
}
#otherlanguages li {
	display: inline;
	padding: .2em .4em;
}
.pageheader #otherlanguages {
	border-bottom: 1px solid #000;
}

.inlinecontent,
.inlineenclosure {
	margin-top: .4em;
}

.pagefooter,
.inlinefooter,
.comments {
	clear: both;
}

#pageinfo {
	margin: 1em 0;
	border-top: 1px solid #000;
}

.tags {
	margin-top: 1em;
}

.inlinepage .tags {
        display: inline;
}

.mapparent {
	text-decoration: none;
}

.img caption {
	font-size: 80%;
	caption-side: bottom;
	text-align: center;
}

img.img {
	display: block;
	height: auto;
	margin: 2ex;
	max-width: 100%;
}

.align-left {
	float:left;
}

.align-right {
	float:right;
}

#backlinks {
	margin-top: 1em;
}

#searchform {
	display: inline;
	float: right;
}

#editcontent {
	width: 98%;
}

.editcontentdiv {
	width: auto;
	overflow: auto;
}

img {
	border-style: none;
}

pre {
	overflow: auto;
}

div.recentchanges {
	border-style: solid;
	border-width: 1px;
	overflow: auto;
	width: auto;
	clear: none;
	background: #eee;
	color: black !important;
}
.recentchanges .metadata {
	padding: 0px 0.5em;
}
.recentchanges .changelog {
	font-style: italic;
	clear: both;
	display: block;
	padding: 1px 2px;
	background: white !important;
	color: black !important;
}
.recentchanges .desc {
	display: none;
}
.recentchanges .diff {
	display: none;
}
.recentchanges .committer {
	float: left;
	margin: 0;
	width: 40%;
}
.recentchanges .committype {
	float: left;
	margin: 0;
	width: 5%;
	font-size: small;
}
.recentchanges .changedate {
	float: left;
	margin: 0;
	width: 35%;
	font-size: small;
}
.recentchanges .pagelinks,
.recentchanges .revert {
	float: right;
	margin: 0;
	width: 60%;
}

.blogform, #blogform {
	padding: 10px 10px;
	border: 1px solid #aaa;
	background: #eee;
	color: black !important;
	width: auto;
	overflow: auto;
}

.inlinepage {
	padding: 10px 10px;
	border: 1px solid #aaa;
}

.pagedate,
.pagelicense,
.pagecopyright {
	font-style: italic;
	display: block;
	margin-top: 1em;
}

.archivepagedate {
	font-style: italic;
}
.archivepage {
	margin-bottom: 1em;
}

.error {
	color: #C00;
}

hr.poll {
	height: 10pt;
	color: white !important;
	background: #eee;
	border: 2px solid black;
}
div.poll {
	margin-top: 1ex;
	margin-bottom: 1ex;
	padding: 1ex 1ex;
	border: 1px solid #aaa;
}

span.color {
	padding: 2px;
}

.comment-header,
.microblog-header {
	font-style: italic;
	margin-top: .3em;
}
.comment .author,
.microblog .author {
	font-weight: bold;
}
.comment-subject {
	font-weight: bold;
}
.comment-avatar {
	float: right;
}
.comment {
	border: 1px solid #aaa;
	padding: 3px;
}

div.progress {
	margin-top: 1ex;
	margin-bottom: 1ex;
	border: 1px solid #888;
	width: 400px;
	background: #eee;
	color: black !important;
	padding: 1px;
}
div.progress-done {
	background: #ea6 !important;
	color: black !important;
	text-align: center;
	padding: 1px;
}

/* things to hide in printouts */
@media print {
	.actions { display: none; }
	.tags { display: none; }
	.trails { display: none; }
	.feedbutton { display: none; }
	#searchform { display: none; }
	.blogform, #blogform { display: none; }
	#backlinks { display: none; }
}

/* infobox template */
.infobox {
	float: right;
	margin-left: 2ex;
	margin-top: 1ex;
	margin-bottom: 1ex;
	padding: 1ex 1ex;
	border: 1px solid #aaa;
	background: white;
	color: black !important;
}

/* notebox template */
.notebox {
	float: right;
	margin-left: 2ex;
	margin-top: 1ex;
	margin-bottom: 1ex;
	padding: 1ex 1ex;
	border: 1px solid #aaa;
	width: 25%;
	background: white;
	color: black !important;
}

/* popup template and backlinks hiding */
.popup {
	border-bottom: 1px dotted #366;
	color: #366;
}
.popup .balloon,
.popup .paren,
.popup .expand {
	display: none;
	text-align: left;
}
.popup:hover .balloon,
.popup:focus .balloon {
	position: absolute;
	display: inline;
	margin: 1em 0 0 -2em;
	padding: 0.625em;
	border: 2px solid;
	background-color: #dee;
	color: black;
}

/* form styling */
fieldset {
	margin: 1ex 0;
	border: 1px solid black;
}
legend {
	padding: 0 1ex;
}
.fb_submit {
	float: left;
	margin: 2px 0;
}
label.block {    
	display: block;   
}
label.inline {    
	display: inline;
}
/* invalid form fields */
.fb_invalid {
	color: red;
	background: white !important;
}
/* required form fields */
.fb_required {
	font-weight: bold;
}

/* highlight plugin */
pre.hl { color:#000000; background-color:#ffffff; }
.hl.num { color:#2928ff; }
.hl.esc { color:#ff00ff; }
.hl.str { color:#ff0000; }
.hl.dstr { color:#818100; }
.hl.slc { color:#838183; font-style:italic; }
.hl.com { color:#838183; font-style:italic; }
.hl.dir { color:#008200; }
.hl.sym { color:#000000; }
.hl.line { color:#555555; }
.hl.mark { background-color:#ffffbb; }
.hl.kwa { color:#000000; font-weight:bold; }
.hl.kwb { color:#830000; }
.hl.kwc { color:#000000; font-weight:bold; }
.hl.kwd { color:#010181; }

/* calendar plugin */
.month-calendar-day-this-day,
.year-calendar-this-month {
	background-color: #eee;
}
.month-calendar-day-head,
.month-calendar-day-nolink,
.month-calendar-day-link,
.month-calendar-day-this-day,
.month-calendar-day-future {
	text-align: right;
}
.month-calendar-arrow A:link,
.year-calendar-arrow A:link,
.month-calendar-arrow A:visited,
.year-calendar-arrow A:visited {
	text-decoration: none;
	font-weight: normal;
	font-size: 150%;
}

/* outlines */
li.L1 { list-style: upper-roman; }
li.L2 { list-style: decimal; }
li.L3 { list-style: lower-alpha; }
li.L4 { list-style: disc; }
li.L5 { list-style: square; }
li.L6 { list-style: circle; }
li.L7 { list-style: lower-roman; }
li.L8 { list-style: upper-alpha; }

/* tag cloud */
.pagecloud {
	float: right;
	width: 30%;
	text-align: center;
	padding: 10px 10px;
	border: 1px solid #aaa;
	background: #eee;
	color: black !important;
}
.smallestPC { font-size: 70%; }
.smallPC { font-size: 85%; }
.normalPC { font-size: 100%; }
.bigPC { font-size: 115%; }
.biggestPC { font-size: 130%; }

/* 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-family: sans-serif;
	font-weight: bold;
	font-size: small;
	text-decoration: none;
	margin-top: 1em;
}
.feedbutton:hover {
	color: white !important;
	background: #ff9900;
}

.FlattrButton {
	display: none;
}

/* openid selector */
#openid_choice {
	display: none;
}
#openid_input_area {
	clear: both;
	padding: 10px;
}
#openid_btns, #openid_btns br {
	clear: both;
}
#openid_highlight {
	background-color: black;
	float: left;
}
.openid_large_btn {
	padding: 1em 1.5em;
	border: 1px solid #DDD;
	margin: 3px;
	float: left;
}
.openid_small_btn {
	padding: 4px 4px;
	border: 1px solid #DDD;
	margin: 3px;
	float: left;
}
a.openid_large_btn:focus {
	outline: none;
}
a.openid_large_btn:focus {
	outline-style: none;
}
.openid_selected {
	border: 4px solid #DDD;
}

.fileupload-content .ui-progressbar {
	width: 200px;
	height: 20px;
}

.trails {
	margin-top: 1em;
	margin-bottom: 1em;
}
.trail {
	text-align: center;
}

.trailprev {
	float: left;
}

.trailup {
}

.trailnext {
	float: right;
}

.trailsep {
	display: none;
}

/* Start of the custom styling */

/* Adapted from a stylesheet by Edward O'Connor */
/* http://edward.oconnor.cx/ */

/* Undo default HTML styling of some elements */

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
  margin: 0;
  padding: 0;
  text-align: left;
}

/* Basic layout */

html {
    overflow-y: scroll;
}

html, body {
  height: 100%;
  margin: 0;
  padding: 0;
}

.page {
  height: 100%;
  min-height: 100%;
  margin: 0 auto 0 auto;
  width: 65em;
  max-width: 98%;
  text-align: justify;
  hyphens: auto;
}

p {
  font-size: large;
  margin: 1.3125em 0;
  padding: 0;
}

li {
  font-size: large;
  padding: 0;
}

#sidebar-text p {
  font-size: 0.9em;
  text-align: right;
}

/* Typography */

/*  6pt = 0.375em
 *  7pt = 0.4375em
 *  8pt = 0.5em
 *  9pt = 0.5625em
 * 10pt = 0.625em
 * 11pt = 0.6875em
 * 12pt = 0.75em
 * 14pt = 0.875em
 * 16pt = 1em
 * 18pt = 1.125em
 * 21pt = 1.3125em
 * 24pt = 1.5em
 * 36pt = 2.25em
 * 48pt = 3em
 * 60pt = 3.75em
 * 72pt = 4.5em
 */

body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 100%;
  line-height: 1.625;
}

h1 { font-size: 1.95em;   line-height: 1.167; margin-bottom: .75em}
h2 { font-size: 1.5em;    line-height: 1.75; margin-bottom: .75em}
h3 { font-size: 1.3125em; line-height: 2; margin-bottom: .75em}
h4 { font-size: 1.25em;   line-height: 1.05; }
h5 { font-size: 1.125em;  line-height: 1.167; }
h6 { font-size: 1em;      line-height: 1.3125; }

/* Color */

body {
  color: #000;
}

a:link, a:active, a:hover {
  text-decoration: none;
  color: rgb(0, 136, 204);
}

a:visited {
  text-decoration: none;
  color: rgb(0, 136, 204);
}


div.pageheader {
    margin-left: 180px;
    padding-top: 20px;
    min-height: 30px;
    font-size: 0.9em;
}

.actions ul {
    height: auto;
}

#pagebody {
    margin-left: 180px;
}

/* Sidebar */

div.sidebar {
    float: left;
    width: 160px;

    margin: auto;
    background: none;

    padding-top: 10px;
    padding-left: 0px;
    padding-right: 10px;

    border: 0px;
    border-right: 1px solid rgb(222, 222, 220);
}

div.sidebar table {
    margin-left: auto;
    margin-right: auto;
}

div.sidebar table caption {
    font-size: 1.5em;
    line-height: 1.4;
}

div.sidebar table img {
    border-radius: 15px;
}

@media screen and (max-device-width: 768px) {
    #pagebody {
        clear: left;
        margin: auto;
    }

    div.pageheader {
        clear: left;
        margin: auto;
    }

    div.sidebar {
        width: 100%;

        margin: auto;
        background: none;

        padding-top: 10px;
        padding-left: 0px;
        padding-right: 10px;

        border: 0px;
        font-size: 120%;
    }

    #sidebar-text {
        display: none;
    }

    #sidebar-links a {
        text-align: center;
        font-size: 130%;
    }

    div.sidebar span {
        text-align: center;
        font-size: 130%;
    }
}

.pageheader .actions ul {
    border-bottom: 0px
}

#sidebar-links span {
    border-bottom: 1px solid rgb(222, 222, 220);
    display: block;
    font-size: large;
}

#sidebar-links a {
    border-bottom: 1px solid rgb(222, 222, 220);
    display: block;
    font-size: large;
}

div.sidebar span {
    border-bottom: 1px solid rgb(222, 222, 220);
    display: block;
    color: rgb(0, 136, 204);
}

.inlinepage {
    border: 0px;
    clear: right;
}

.feedbutton {
    margin-top: 0;
}

.feedlink {
    float: right;
    clear: right;
}

/* relevant to the index page */
.album-end, .album-item {
	clear: both;
}

.album-item .album-title,
.album-item .album-metadata,
.album-item .album-caption {
	margin-left: 120px;
}

.album-item .album-thumbnail {
	float: left;
	padding: 8px;
	margin-right: 0px;
	margin-left: auto;
	text-align: right;
}

.album-item .album-metadata {
	padding: 8px;
	font-size: small;
}

.album-item .album-size, .album-item .album-ctime {
	padding-right: 1em;
}

.album-item .album-title {
	font-weight: bold;
	font-size: larger;
}

.album-item .album-title a {
	text-decoration: underline;
}

/* relevant to the viewer page */
#album-img a img {
    width: 98%;
    height: auto;
}

.album-arrow {
	font-size: 400%;
}

.album-item {
	padding: 2px 0px;
}

.album-viewer {
	text-align: center;
}

.album-next, .album-finish {
	float: right;
}

.album-prev {
	float: left;
}

.album-prev a, .album-next a, .album-finish a {
	padding-top: 1em;
	text-decoration: none;
}

blockquote {
  background: none repeat scroll 0 0 rgba(255, 255, 255, 0.05);
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.2);
  display: block;
  font-style: italic;
  margin: 20px auto;
  padding: 1em;
  position: relative;
  width: 70%;
  text-align: center;
}

blockquote p {
  margin: 0px;
  padding: 0px;
}