/*------------------------------------*\
               TYPOGRAPHY
\*------------------------------------*/
/*------------------------------------*\
    $FONT INCLUDES
\*------------------------------------*/
//@import url(http://fonts.googleapis.com/css?family=Maven+Pro:400,700,900);
//@import url(http://fonts.googleapis.com/css?family=Lato:400,700);
//@import url(http://fonts.googleapis.com/css?family=Herr+Von+Muellerhoff);

body {
	font-size: 16px;
	line-height: 1.625;
	color: $gray;

	@include media-query(lap-and-up) {
		// font-weight: 300;
	}
}

/*------------------------------------*\
               HEADINGS
\*------------------------------------*/

h1, h2, h3, h4, h5, h6, hgroup, p {
	margin-bottom: 30px;
}

h1, h2, h3, h4, h5, h6 {
	margin-bottom: 30px;

	font-family: $heading-font-family;
	font-weight: bold;
	letter-spacing: 0.1em;
	text-transform: uppercase;

	color: $dark;
}

h1 {
	margin-top: $_35u;
	margin-bottom: $_175u;

	font-weight: 900;
}

h2, h3, h4 {
	margin-top: $_175u;
	font-weight: 500;
}

h5, h6 {
	font-weight: 400;
	letter-spacing:6px;
}

.article__title, .article__title .hN, .widget__title .hN, .heading .hN {
	margin-top: 0;
}

.heading {
	h2 {
		display: inline-block;
		margin-bottom: 0;
	}

	.archive__side-title {
		@extend .beta;

		font-weight: bold;
		color: $light;
	}
}

//Headings scaling - based on
//http://typecast.com/blog/a-more-modern-scale-for-web-typography

$lap-scale-size: 0.83;

@include screen(601px, 999px) {
	h1, .alpha {
		font-size: $h1-size*$lap-scale-size;
	}
}

$palm-scale-size: 0.60;

@include max-screen(600px) {
	h1, .alpha {
		font-size: $h1-size*$palm-scale-size;
	}
	h2, .beta {
		font-size: $h2-size*$lap-scale-size;
	}
	h3, .gamma {
		font-size: $h3-size*$lap-scale-size;
	}
	blockquote {
		font-size: 18px;
	}
}

@include media-query(palm) {
	body {
		font-size: 18px/30px;
	}
}

/*------------------------------------*\
    $PARAGRAPHS
\*------------------------------------*/
.article__content p {
	margin-bottom: $_u;
}

/*------------------------------------*\
               LINKS
\*------------------------------------*/

%text-link {
	text-decoration: none;

	&, &:hover {
		color: $accent;
	}
}

a {
	@extend %text-link;

	border-bottom: none;

	&:hover {
		color: $accent;
	}
}

.link--light {
	color: $lightest;
}

.link--dark {
	color: $dark;
}

.link--light, .link--dark {
	&:hover {
		color: $accent;
	}
}

.article__content a:not([class]) {
	@extend %text-link;

	padding-bottom: 2px;
	border-bottom: 2px solid $accent;
}

.article__content {
	a[href$=".jpg"], a[href$=".jpeg"], a[href$=".png"], a[href$=".gif"], a[href$=".bmp"] {
		border: 0;
	}
}

.link--simple a {
	border-bottom: 0;
}

/*------------------------------------*\
               BLOCKQUOTES
\*------------------------------------*/

blockquote {
	margin: $_15u 0;

	@include font-size(24px);
	line-height: 1.5;
	text-indent: 0;

	border-left: 10px solid $accent;

	color: $accent;

	quotes: none;

	@include media-query(palm) {
		padding-left: $_u2;
	}

	@include media-query(lap-and-up) {
		padding-left: $_15u;
	}

	cite, .testimonial__author-name {
		@extend .cf;

		margin-top: $_u2;
		color: $lightest;

		@include font-size(20px);
		font-style: normal;
		font-weight: 400;

		&:before {
			content: "";

			position: relative;
			top: -5px;

			display: inline-block;
			margin: 0 10px;
			width: 20px;

			border-top: 2px solid $lightest;
		}
	}
}

/*------------------------------------*\
               TABLES
\*------------------------------------*/

.table--bordered {
	@include font-size(14px);

	th,
	td {
		border: 0;

		&:empty {
			border: inherit;
		}
	}
}

.table--striped {

	tbody tr {
	}

	tbody tr:nth-of-type(odd) {
		background-color: #fcfcfc;
	}
}

table {
	@extend .table--bordered;
	@extend .table--striped;
}

/*------------------------------------*\
               LISTS
\*------------------------------------*/

ol {
	margin-top: $_u;
	margin-bottom: $_u;

	ul &, ol &, dl & {
		@include rem(margin-left, $_15u);
		border-left: 0;
		padding-left: 0;
	}

	li {
		margin-bottom: $_u4;
	}

	@include media-query(palm) {
		@include rem(margin-left, $_u);
	}
}

dl {

}

dt {
	font-weight: bold;

	dd + & {
		@include rem(margin-top, $_u);
	}
}

dd {
	margin-left: 0;
}

ol.breadcrumb {
	margin: $_u 0 $_u2;

	text-transform: uppercase;
	font-size: 12px;
	line-height: 1;

	color: $light;

	a {
		color: $light;

		&:hover {
			color: $accent;
		}
	}
}

/*
 * Font-weight
 */
b,
strong {
	font-weight: 600;
}