/* -------------------------------------------- *\
   Header (general)
\* -------------------------------------------- */

.header-page {
  /* position: fixed; */
  width: 100%;
  /*height: 160px;*/
  margin: 0;
  text-align: center;
  /*background-color: #f2f2f2; /*#f2f2f2;
  color: #555;
  border-bottom: 1px solid #eee;
  -moz-box-shadow: 5px -1px 2px 1px #999;
  -webkit-box-shadow: 5px -1px 2px 1px #999;
  box-shadow: 5px -1px 2px 1px #999;*/
}

.header-page h1 {
  font-size: 1.8em;
  font-weight: normal;
  margin: 0;
  padding: 10px 0 0 0;
  /*background-color: #fff;
  border-bottom: 0.5px solid #eee;
  -moz-box-shadow: 5px -1px 2px 1px #aaa;
  -webkit-box-shadow: 5px -1px 2px 1px #aaa;
  box-shadow: 5px -1px 2px 1px #aaa;*/
}

.header-page h1{
  font-weight: 100;
}

.header-page h1 a {
  text-decoration: none;
  color: #777;
}

.header-page h1 a:hover {
  color: #f74a52;
  transition: 0.4s linear;
}

.header-page h4 a {
  text-decoration: none;
  color: red;
}

.header-page h4 a:hover {
  color: #f74a52;
  transition: 0.4s linear;
}

.header-page hr {
  margin-top: 15px;
  margin-bottom: 0px;

}


@media screen and (max-width: 570px) {
  .header-page {
    height: auto;
  }

  .header-page #nav ul {
    padding-top: 10px;
  }

  .header-page #nav li {
    display: block;
  }

  .header-page #nav li a {
    display: block;
    padding: 3px;
  }
}


/* -------------------------------------------- *\
   Header (home)
\* -------------------------------------------- */

.header-home {
  position: fixed;
  width: 100%;
  height: auto;
  margin-top: 0px;
  text-align: center;
/*  background-color: rgba(90, 90, 90, 0.3); */
  color: #555;
/*  color: #fff; */
}

.header-home h1 {
  font-size: 1.5em;
  font-weight: normal;
  margin-top: 0.2em;
}

.header-home h1 a {
  text-decoration: none;
  color: #555;
}

.header-home #nav {
  float: left;
  width: 100%;
  overflow: hidden;
  position: relative;
  padding: 0;
}

.header-home #nav ul {
  clear: left;
  float: left;
  list-style: none;
  margin: 0;
  padding: 0em 0em 0.5em 0em;
  position: relative;
  left: 50%;
  text-align: center;
}

.header-home #nav ul li {
  display: inline;
  list-style: none;
  font-size: 1em;
  margin: 0;
  padding: 0;
  position: relative;
  right: 50%;
  font-family: 'Open Sans', helvetica, arial, sans-serif;
}

.header-home #nav ul li a {
/*  display: block; */
  margin: 0 0 0 0px;
  padding: 0px 30px;
  text-decoration: none;
  color: #555;
  line-height: 1.3em;
}

.header-home #nav ul li a:hover   {
  color: #f74a52;
  transition: 0.3s linear;
}

img.bg {
  /* Set rules to fill background */
  min-height: 100%;
  min-width: 1024px;

  /* Set up proportionate scaling */
  width: 100%;
  height: auto;

  /* Set up positioning */
  position: fixed;
  top: 0;
  left: 0;
}

@media screen and (max-width: 1024px) { /* Specific to this particular image */
  img.bg {
    left: 50%;
    margin-left: -512px;   /* 50% */
  }
}


/* -------------------------------------------- *\
   Footer
\* -------------------------------------------- */

#footer {
  width: 100%;
/*  background-color: rgba(240, 240, 240, 0.5); */
  background-color: #444;
  color: #aaa;
  padding: 1.5em 0 1.5em 0;
  text-align: center;
  font-family: Helvetica, Arial, sans-serif;
  font-size: 14px;
  clear: both;
}

#footer a {
  text-decoration: none;
  color: #53b9c9; /*#0a9cb2;*/
}

/* -------------------------------------------- *\
   Content (main section)
\* -------------------------------------------- */

/* Global Reset */
* {
  margin: 0;
  padding: 0;
}

html, body {
  height: 100%;
  margin: 0;
  font-size: 16px;
  background-color: #fafafa;
}

#content {
  height: 100%;
}

#block {
  width: 100%;
}

#gallery {
  width: 100%;
  padding-top: 5px;
  padding-bottom: 5px;
  margin-bottom: 30px;
}

.disqus {
  margin-top: 1em;
  margin-left: auto;
  margin-right: auto;
  padding: 1em;
  box-shadow: 0 0 8px #222;
}

.prose {
  /*max-width: 700px;*/
  max-width: 70%;
  margin-top: 5px;
  margin-left: auto;
  margin-right: auto;
  padding: 1.5em;
  background-color: #F8F8F5;
  box-shadow: 0 0 10px #ccc;
}

@media screen and (max-width: 768px) {
  .prose {
    max-width: 100%;

  }
}

@media screen and (max-width: 480px) {
  .prose {
    max-width: 100%;
    padding: 0.5rem;
  }
}

.wide-image {
  width: 100%;
  margin-top: 5px;
}

.full {
  width: 100%;
  max-height: 700px;
  margin: 0;
}

.column1of2, .column2of2 {
  display: block;
  width: 330px;
  float: left;
  padding: 10px;
  text-align: center;
}

.column1of2 p {
  text-align: center;
}
.column2of2 p {
  text-align: center;
}

.column1of2 {
  margin-left: calc((100% - 60%)/2);
}


.column1of3, .column2of3, .column3of3 {
  width: 30%;
  float: left;
  padding: 10px;
  text-align: center;
}

.column1of3 p, .column2of3 p, .column3of3 p {
  text-align: center;
}

/*
.column1of3 {
  margin-left: calc((100% - 700px)/2);
}
*/

/* id attribute "svgtree" that centers d3js layout tree (graph) */
#svgtree {margin-left:auto; margin-right: auto;}

.clear {
  clear: left;
}




/* ================================ *\
   Typography
\* ================================ */

body {
  font-family: "Palatino Linotype", "Book Antiqua", Palatino, 'EB Garamond', serif;
  font-style: normal;
  font-weight: 400;
  /*font-size: 1.5rem;*/
  color: #444;
/*  text-align: center; */
}

@media screen and (min-width:1024px){
  body {
    font-size: 1.5rem;
  }
}

h1 {
  font-size: 2.0em;
  font-weight: 400;
  color: #aaa;
  margin-top: 0.2em;
  margin-bottom: 0.2em;
}

h2 {
  font-size: 1.6em;
  color: #444;
  margin-top: 1em;
  margin-bottom: 0.2em;
  font-style: Bold;
}

h3 {
  font-size: 1.2em;
  color: #444;
  margin-top: 1.2em;
  margin-bottom: 0.2em;
  font-style: Medium;
  font-weight: 500;
}

h4 {
  font-weight: 300;
  color: #aaa;
  margin-top: 0.5em;
  font-style: italic;
  font-weight: 400;
}

h5, h6 {
  font-size: 0.8em;
  color: rgb(80, 70, 70);
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  font-style: thin;
  font-weight: 100;
}

time {
  font-style: thin;
  font-weight: 100;
}

p {
  margin-top: 1em;
  line-height: 1.3em;
  text-align: justify;
}

ul p {
  margin-top: 0;
}

blockquote {
  font-weight: 400;
  color: #808080;
  border-left: 5px solid #f86e74;
  padding-left: 10px;
  margin-left: 30px;
  margin-top: 1em ;
  margin-bottom: 1em;
  font-style: italic;
}

pre {
  font-family: Monaco, Menlo, "Courier New", monospace;
  font-size: 16px;
  /*color: #333;*/
  display: block;
  font-size: 16px;
  line-height: 22px;
  border: 1px solid rgba(0,0,0,0.15);
  -webkit-border-radius:4px;
  -moz-border-radius:4px;
  border-radius: 4px;
  white-space: pre-wrap;
  word-break: break-all;
  margin: 0 0 15px;
  padding: 10px;
  box-sizing: border-box;
}

code {
  font-family: Monaco, Menlo, "Courier New", monospace;
  font-size: 16px;
  -webkit-border-radius:3px;
  -moz-border-radius:3px;
  color: #333;
  border-radius: 3px;
  border: 1px solid rgba(0,0,0,0.15);
  /*background-color: #f5f5f5;*/
  margin: 5px 0 5px;
}

pre code {
  border: none;
  font-size: 14px;
}



/* ================================ *\
   Links, buttons, lists, breaks
\* ================================ */

a {
  color: #f74a52;
  text-decoration: none;
}

li p a {
  color: rgb(93, 93, 231);
}

a:hover {
  color: #0a9cb2;
  text-decoration: underline;
  transition: 0.2s ease-in;
}

.redbutton {
  background: #f74a52;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  padding: 5px 10px 5px 10px;
  color: white;
  text-decoration: none;
}

.redbutton:hover {
  background: #0a9cb2;
  transition: 0.3s ease-in;
  color: white;
  text-decoration: none;
}

.greenbutton {
  background: #0a9cb2;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  padding: 5px 10px 5px 10px;
  color: white;
  text-decoration: none;
}

.greenbutton:hover {
  background: #f74a52;
  transition: 0.3s ease-in;
  color: white;
  text-decoration: none;
}

.graybutton {
  background: #f2f2f2;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  padding: 5px 10px 5px 10px;
  color: #777;
  text-decoration: none;
}

.graybutton:hover {
  background: #f74a52;
  transition: 0.2s ease-in;
  color: white;
  text-decoration: none;
}

ul, ol {
  /*margin-top: 1.1em;*/
  margin-top: 0.8em;
  margin-bottom: 0.8em;
}

ul li {
  margin-left: 1.1em;
/*  line-height: 1.5em; */
  line-height: 1.3em;
}

ol li {
  margin-left: 1.3em;
  line-height: 1.5em;
}


hr {
  border: 1px solid #eee;
  margin-top: 30px;
  margin-bottom: 30px;
}

hr.margin {
  border: 1px solid #0a9cb2;
  margin-top: 10px;
  margin-bottom: 10px;
}



/* ================================ *\
   Images and figures
\* ================================ */

svg, figure {
  display: block;
  max-width: 100%;
  height: auto;
}

figure {
  margin-bottom: 25px;
  margin-bottom: 1.55rem;
  display: block;
}

figure img {
  margin-bottom: 12px;
  margin-bottom: .75rem;
}

.centered {
  display: block;
  max-width: 100%;
  margin: auto;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

.mosaic {
  width: 30%;
  display: block;
  margin-left: 2.5%;
  padding-top: 10px;
  padding-bottom: 10px;
  float: left;
}

@media screen and (max-width: 770px) {
  .centered {
    max-width: 100%;
  }
}


/* ================================ *\
   D3js simple graph (May 20, 2014)
\* ================================ */

	path {
		stroke: steelblue;
		stroke-width: 2;
		fill: none;
	}

	.axis path,
	.axis line {
		fill: none;
		stroke: grey;
		stroke-width: 1;
		shape-rendering: crispEdges;
	}


/*Table*/
table {
	border-collapse: collapse;
	border-spacing: 0;
  margin: auto;
  border: solid;
}
table {
	margin-bottom: 1.5em;
	/*24 / 16*/
	font-size: 1em;
	/* width: 100%; */
}
thead th,
tfoot th {
	padding: .25em .25em .25em .4em;
}
th {
	text-align: left;
  border: solid;
}
td {
	vertical-align: top;
	padding: .25em .25em .25em .4em;
  border: solid;
}

.footnote {
  font-size: 70%;
  color: blueviolet;
}

.comment {
  color:orange;
}

/*****************************************************************************/
/* Posts
/*****************************************************************************/

/* standard */
/* ==============
.post pre {
  border: 1px solid rgba(0,0,0,0.15);
  background-color: #f5f5f5;
  padding: 14.5px;
}

.post code {
  border: 1px solid rgba(0,0,0,0.15);
  background-color: #f5f5f5;
  padding: 0 .2em;
}

.post pre code {
  border: none;
}
============== */

.post pre {
  margin-top: 10px;
}

.post code {
  margin-top: 10px;
  padding: 0;
}



/* date */
.post .date {
  color: #ddd;
  font-size: 80%;
  font-family: Helvetica, Arial, sans-serif;
}

.post img {
  /*max-width: 90%;*/
  width: 90%;
  display: block;
  margin-left: auto;
  margin-right: auto;
/*  padding: 5px; */
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

.post img.centered {
  max-width: 100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
/*  padding: 5px; */
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

.categories, .tags, .previous_next {
  font-size: 90%;
  font-weight: lighter;
  color: #888;
  float: center;
}

/*
.previous_next a {
  font-size: 90%;
  font-weight: lighter;
  float: center;
}
*/

/* date */
.archive-list .date {
  color: #ddd;
  font-size: 70%;
  font-family: Helvetica, Arial, sans-serif;
  font-weight: lighter;
}

.listing-item,.listing-seperator{list-style-type:none;}
.listing-item a{padding:.2em 1em;}
.listing-item time{
  color: #aaa;
  font-family: Monaco, Menlo, "Courier New", monospace;
  font-weight: 100;
  font-size: 80%; }
.listing-seperator{color: #444;}


.meta, .categories, .tags, .previous_next, .archive-list, #tag_cloud {
  margin-left: auto;
  margin-right: auto;
  font-size: 0.9em;
}

@media (min-width: 800px) {
  .meta, .categories, .tags, .previous_next, .archive-list, #tag_cloud {
    width: 100%;
  }
}

.highlight table td { padding: 5px; }
.highlight table pre { margin: 0; }
.highlight, .highlight .w {
  color: #444444;
}
.highlight .cp {
  color: #CC00A3;
}
.highlight .cs {
  color: #CC00A3;
}
.highlight .c, .highlight .cd, .highlight .cm, .highlight .c1 {
  color: #FF0000;
}
.highlight .kc {
  color: #C34E00;
}
.highlight .kd {
  color: #0000FF;
}
.highlight .kr {
  color: #007575;
}
.highlight .k, .highlight .kn, .highlight .kp, .highlight .kt, .highlight .kv {
  color: #0000FF;
}
.highlight .s, .highlight .sb, .highlight .sc, .highlight .sd, .highlight .s2, .highlight .se, .highlight .sh, .highlight .si, .highlight .sx, .highlight .sr, .highlight .s1, .highlight .ss {
  color: #009C00;
}
.highlight .nb, .highlight .bp {
  color: #C34E00;
}

.blanktheorem,
.theorem,
.definition,
.proposition {
    font-family: 'EB Garamond', serif;
}

.thm {
    display: block;
    margin: 12px 0;
    font-style: normal;
}

.thm::before {
    content: attr(title) ". ";
    font-weight: bold;
    font-style: normal;
}

.blanktheorem,
.theorem {
    display: block;
    margin: 12px 0;
    font-style: normal;
}
.theorem:before {
    content: "Theorem. ";
    font-weight: bold;
    font-style: normal;
}

.lemma {
    display: block;
    margin: 12px 0;
    font-style: italic;
}
.lemma:before {
    content: "Lemma.";
    font-weight: bold;
    font-style: normal;
}

.proof {
    display: block;
    margin: 12px 0;
    font-style: normal;
}
.proof:before {
    content: "Proof. ";
    /*font-style: italic;*/
}
.proof:after {
    content: "\25FC";
    float:right;
}


.definition {
    display: block;
    margin: 12px 0;
    font-style: normal;
}

.definition:before {
    content: "Definition.";
    font-weight: bold;
    font-style: normal;
}

.remark {
    display: block;
    margin: 12px 0;
    font-style: italic;
}

.remark:before {
    content: "Remark.";
    font-weight: bold;
    font-style: italic;
}

.proposition {
    display: block;
    margin: 12px 0;
    font-style: normal;
}

.proposition:before {
    content: 'Proposition.';
    font-weight: bold;
    font-style: normal;
}

.corollary {
    display: block;
    margin: 12px 0;
    font-style: normal;
}

.corollary:before {
    content: 'Corollary.';
    font-weight: bold;
    font-style: normal;
}

.example {
    display: block;
    margin: 12px 0;
    font-style: italic;
}

.example:before {
    content: "Example.";
    font-weight: bold;
    font-style: italic;
}

blockquote.thm p {
    display: inline;
  }


blockquote.theorem p {
    display: inline;
  }

blockquote.proposition p {
    display: inline;
}

blockquote.proof p {
    display: inline;
}

blockquote.proof {
    border-left: none;
    /*border-right: 5px solid #cc00a3;*/
}

blockquote.comment {
    color: #cc00a3;
}