@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro);
@import url(https://fonts.googleapis.com/css?family=Merriweather);

body { padding-top: 20px; padding-bottom: 40px; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; }

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: 'Source Sans Pro', sans-serif; font-weight: 700;}

blockquote p { font-size: 16px; line-height: 1.6em; }

/* Masthead */
.notes, .header, h3 { font-family: 'Merriweather', serif; font-weight: normal; }



/* Navigation */
h3.text-muted a {text-decoration: none; color: #323a45; }
h3.text-muted a:hover { text-decoration: none; color: #112e51; }

img.avatar { margin-bottom: 30px; }

/* Custom container */
.container > hr { margin: 30px 0; }
.container > hr.footer {margin-bottom: 15px; }


/* Jumbotron */

.jumbotron { margin: 80px 0; }
.jumbotron h1 { font-size: 72px; line-height: 1; }
.jumbotron .btn { font-size: 21px; padding: 14px 24px; }
.marketing p { line-height: 25px; }
.marketing p.lead { line-height: 30px; }

/* Notes */
.notelist { width: 600px; margin: 0 auto; }
ul.listnotes { margin: 0 auto; }
ul.listnotes li {line-height: 30px; }

/* Note */
.note, .contact, .writing, .about, .error, .cv, .speaking, .press { width: 85%; margin: 0 auto; line-height: 26px; }
.note h2.date, .swatch-log h2.date { font-size: 24.5px; font-weight: 300; font-style: italic; }


/* CV */
.cv {line-height: 23px; width: 90%; margin: 0 auto;}
.cv li { line-height: 23px; }
.cv h2 { font-size: 26.5px; }
.cv h1 { font-size: 32.5px; }

.contact, .about, .cv, .error, .writing, .speaking, .press { margin-bottom: 80px; }

/* Contact */
iframe {font-family: 'Source Sans Pro', sans-serif; font-size: 16px;}

/* About */
.about ul.list-unstyled li { line-height: 30px; text-indent: -30px; margin-left: 30px;}

/* Guides */
.guide { width: 90%; margin: 0 auto 60px auto; line-height: 26px;}
.guide .title { padding: 100px 30px 0px; width: 100%; height: 60%; margin-bottom: 40px; background: #112e51; color: #428bca; }
.guide .title h1 { font-size: 46px; color: #112e51; }
.guide p { margin: 0 0 1em;  }
.guide img { border: solid 1px #323a45; border-radius: 4px; margin: 40px auto; display: block; }
.guide .notes { font-size: 12px; }
.guide .notes h2 { font-size: 14px; }

/* Code */
pre.prettyprint { padding: 10px !important; margin: 40px; font-size: 12px;}

.step { border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	width: 35px;
	height: 35px;
	background: #112e51;
	color: #FFF;
	float: left;
	text-align: center;
	font-size: 24px;
	padding-top: 5.5px;
	margin: 5px 15px 0px 0px;
	font-family: 'Montserrat', Helvetica, sans-serif; }

	/*
 * Messages
 *
 * Show alert messages to users. You may add it to single elements like a `<p>`,
 * or to a parent if there are multiple elements to show.
 */

.message {
  margin-bottom: 1rem;
  padding: 1rem;
  color: #717171;
  background-color: #f9f9f9;
}

/* Site footer */

.site-footer {
  border-top: 1px solid #e8e8e8;
  padding: 30px 0;
}

.footer-heading {
  font-size: 18px;
  font-weight: 300;
  letter-spacing: -.5px;
  margin-bottom: 15px;
}

.site-footer .column { float: left; margin-bottom: 15px; }

.footer-col-1 {
  width: 270px; /*fallback*/
  width: -webkit-calc(35% - 10px);
  width: -moz-calc(35% - 10px);
  width: -o-calc(35% - 10px);
  width: calc(35% - 10px);
  margin-right: 10px
}
.footer-col-2 {
  width: 175px; /*fallback*/
  width: -webkit-calc(23.125% - 10px);
  width: -moz-calc(23.125% - 10px);
  width: -o-calc(23.125% - 10px);
  width: calc(23.125% - 10px);
  margin-right: 10px
}
.footer-col-3 {
  width: 335px; /*fallback*/
  width: -webkit-calc(41.875%);
  width: -moz-calc(41.875%);
  width: -o-calc(41.875%);
  width: calc(41.875%);
}

.site-footer ul { list-style: none; }

.site-footer li,
.site-footer p {
  font-size: 15px;
  letter-spacing: -.3px;
  color: #828282;
}

.github-icon-svg,
.twitter-icon-svg {
  display: inline-block;
  width: 16px;
  height: 16px;
  position: relative;
  top: 3px;
}