body {
  font-family: 'Lato', 'Avenir', sans-serif;
  font-weight: 400;
  font-size: 15px;
  letter-spacing: .5px;
  line-height: 25px;
  margin: 0;
  padding: 0;
}
.img-circle {
  border-radius: 50%;
  box-shadow: 0 0 0 6px white;
}
em {
  font-style: normal;
  color: #457aba;
  font-weight: bold;
}
a {
  text-decoration: none;
  color: #ff6760;
  border-bottom: 1px dotted #ff6760;
}
a.oembed {
  padding-right: 20px;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAA/ElEQVR4nKXQIUtDURiH8d/mLCaTQTAIWgzCTBZBEQxGs+BMJoOYLWsD/QSD+QmsWiyixS4GTaIGEUQEZbAwwz1jhzvv3R3+4cJ5z3mf59zzlrp7Nf9JJVqXMIOJIcwPntGNBYs4w1zBix+xhbty2GiNAMM8TqEnqGY0bkueFn+r4WwpFpTTZEgDC6m9t5jJAnuZxHReQ57gA+u4DPXsKIJXrOA21PuSyR9iKm6sGMwDNvAU6iPUw/o43ZwW3Eum/C6Z+AkOMv7yT8EXvjGGJnbz4FjQwTiWcYNPrA1hO/SHeB0dVAvAcBULdnCBdgGwjXPU6D/hBZsF4IH8AtZpJuuCvVxQAAAAAElFTkSuQmCC) no-repeat right center;
}
a.oembed:hover {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAArklEQVR4nKWSQQrCMBREp6KCe13ZVRbeQrypd8nGA3TrUSI8F/0JbWjSRgc+oc3M47dMB+gf7ex0krykIInKBPO5RAAEeNrkLZcAoWC8R6PN2d6HHFDSAFwySJSA9A9KOkk6Vh2VDd5Ab/fXySazDUqAabi35wF4bAEshZdUBNw2hKuAp0Fq4QToGKscJO0bGvyRdJhW+dUQnvttFcdYz1Ijo4L5XP4JP2utiav6AnEcHrU2z5MrAAAAAElFTkSuQmCC);
}
hr {
  margin: 120px 0 50px;
}
a:visited {
  color: #ff1e14;
}
a:hover {
  color: white;
  background-color: #ff6760;
  border-bottom: 1px dotted white;
}
a:active {
  background-color: #ff1e14;
}
ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
section {
  box-sizing: border-box;
  padding: 0 15px;
  margin: 0 auto;
}
section:before,
section:after {
  display: table;
  content: " ";
}
section:after {
  clear: both;
}
.content {
  padding-top: 70px;
  padding-bottom: 70px;
  margin-left: auto;
  margin-right: auto;
  overflow: auto;
}
.content.post {
  padding: 45px 15px 70px;
}
.content.post header {
  padding-bottom: 25px;
  color: #333;
  font-size: 1.6em;
  line-height: 1.2;
}
.content.post header h1 {
  margin: .2em;
}
.content.post header .meta {
  color: #999;
  font-size: .7em;
}
.content.post .post-body {
  font-size: 1.2em;
  color: #373737;
  line-height: 1.6;
}
.content.post .post-body ul {
  list-style: disc;
  margin-left: 2em;
}
.content.post .post-body img {
  display: block;
  max-width: 100%;
  margin: auto;
}
.content.post .post-body .figure {
  font-size: .85em;
  font-style: italic;
  letter-spacing: .3px;
  margin: 1em;
  color: #333;
}
.content.post .post-body .figure.left {
  float: left;
  margin-right: 2em;
}
.content.post .post-body .figure.right {
  float: right;
  margin-left: 2em;
}
.content.post .post-body .figure.w180 {
  width: 180px;
}
.content.post .post-body .figure.w250 {
  width: 250px;
}
.content.post .post-body .figure.w500 {
  width: 500px;
}
.content.post .post-body .figure.center {
  text-align: center;
  clear: both;
}
.content.post .post-body .figure.image {
  text-align: center;
  clear: both;
  margin: 2em auto 3em;
}
.content.post .post-body pre {
  padding: .5em;
  background-color: #eee;
  border: 1px solid #ddd;
  font-size: .80em;
  overflow: auto;
}
.content.post .post-body .sidenote {
  float: right;
  clear: right;
  text-align: justify;
  font-size: .9em;
  width: 18em;
  border: 1.2em solid white;
  margin: -1em -4.2em 0em 1em;
  background-color: #ddd;
}
.content.post .post-body .sidenote p {
  margin: 1em;
}
.content.post .post-body .sidenote img {
  margin: .5em auto;
  max-width: 100%;
  display: block;
}
.content.post .post-body .sidenote h3 {
  color: white;
  text-shadow: #999 2px 2px 2px;
  font-size: 1.7em;
  font-weight: bold;
  font-family: "arial black", sans-serif;
  margin: 0 .3em !important;
  text-indent: -2px;
}
.content section {
  box-sizing: border-box;
}
.content header {
  text-align: center;
  font-size: 1.3em;
}
.alternate {
  clear: both;
  background: #222;
  color: #ccc;
}
.alternate-second {
  clear: both;
  background: #457aba;
}
.alternate-second a {
  color: black;
  border-color: black;
}
#maciej-lebkowski {
  background-color: #ff6760;
  padding: 100px 15px 130px;
}
#maciej-lebkowski header {
  max-width: 750px;
  margin: 0 auto;
  color: white;
  text-align: center;
  position: relative;
}
#maciej-lebkowski .hello {
  font-weight: 400;
  font-size: 1em;
}
#maciej-lebkowski strong {
  display: block;
  font-size: 2.4em;
  line-height: 1;
  margin-bottom: 1em;
}
#maciej-lebkowski img {
  margin-top: 10px;
  transform: scaleX(-1);
  -webkit-transform: scaleX(-1);
}
.post #maciej-lebkowski {
  padding: 10px 15px;
}
.post #maciej-lebkowski .hello {
  text-align: left;
  padding: 0;
  margin: 0;
}
.post #maciej-lebkowski .hello strong {
  padding-left: 65px;
  line-height: 50px;
  margin: 0;
  font-size: 1.8em;
}
.post #maciej-lebkowski a {
  color: white;
}
.post #maciej-lebkowski a:hover {
  color: #eee;
}
.post #maciej-lebkowski img {
  position: static;
  width: 50px;
  height: 50px;
  transform: none;
  -webkit-transform: none;
  margin: 0;
  float: left;
  box-shadow: 0 0 0 3px white;
}
.category blockquote {
  border-left: 3px solid #457aba;
  padding: 1px .5em 1px 1em;
  margin-left: 1em;
  color: #666;
}
#about article {
  font-size: 1.2em;
  line-height: 1.6em;
}
#about li {
  list-style-type: disc;
  margin-left: 2em;
}
#values li {
  list-style: disc inside;
}
#skills .continuation {
  text-indent: 2em;
}
#writing header {
  text-align: left;
}
#writing h3 {
  color: #eee;
}
#writing h3 a {
  font-size: .7em;
  margin-left: 1em;
}
#quotes blockquote {
  margin: 1em 0;
}
#quotes blockquote:after {
  text-align: right;
  font-style: italic;
  color: #666;
  display: block;
  content: " — " attr(cite);
}
/******************************************************************************/
/** Wide screen **/
@media (min-width: 992px) {
  .content {
    max-width: 970px;
  }
}
/** Above iPad **/
@media (min-width: 768px) {
  .content {
    max-width: 750px;
  }
  .content .span-half header {
    text-align: left;
  }
  #maciej-lebkowski header {
    text-align: right;
  }
  #maciej-lebkowski .hello {
    width: 50%;
    padding-right: 45px;
  }
  #maciej-lebkowski img {
    position: absolute;
    left: 50%;
    margin-left: 35px;
  }
  .spanned .span-half {
    float: left;
    width: 50%;
    box-sizing: border-box;
    padding-left: 0;
    padding-right: 0;
    min-height: 1px;
  }
  .span-first {
    padding-left: 0;
    padding-right: 2em;
  }
  #quotes blockquote {
    float: left;
    width: 50%;
    padding: 1em 2em 1em 0;
    box-sizing: border-box;
    margin: 1em 0;
  }
}
/** Mobile-ish **/
@media (max-width: 767px) {
  body #maciej-lebkowski {
    padding: 40px 15px 100px;
  }
  .post #maciej-lebkowski .hello strong {
    font-size: 1.6em;
    line-height: 40px;
    padding-left: 55px;
  }
  .post #maciej-lebkowski .hello img {
    width: 40px;
    height: 40px;
  }
}