//@import url(http://fonts.googleapis.com/css?family=Bitter:400,400italic,700);

body {
	font-size: 16px;
	font-size: @baseFontSize;
	line-height: @baseLineHeight;
	color: @textColor;
}

a {
	color: @linkColor;
	text-decoration: none;
	&:hover,
	&:focus {
		color: @linkColorHover;
		text-decoration: underline;
	}
}

.social {
	a {
		color: @socialLinkColor;
		line-height: @baseLineHeight * 1.85;
		.transition(text-shadow 0.5s);
		.opacity(60);
        @media @mobileLayout {
        	.opacity(90);
        }
		&:hover,
		&:focus {
            text-shadow: 0 0 10px rgba(255,255,255,0.8);
			color: @socialLinkColor;
			text-decoration: none;
			.opacity(90);
            @media @mobileLayout {
            	.opacity(100);
            }
		}
	    [class^="icon-"] {
	        .transition(opacity 0.5s);
	        .icon-3x;
	        @media @mobileLayout {
	        	.icon-2x;
	        }
	    }
		.label {
			font-family: @altFontFamily;
			font-weight: @headingsFontWeight;
			font-size: @baseFontSize * 1.75;
		}
	}
}

.page-content {
	font-family: @baseFontFamily;
	&>.content {
		text-rendering: optimizeLegibility;
		h1, h2, h3, h4, h5, h6,
		.h1, .h2, .h3, .h4, .h5, .h6 {
			margin: (@baseLineHeight / 2) 0;
			font-family: @headingsFontFamily;
			font-weight: @headingsFontWeight;
			line-height: @baseLineHeight;
			color: @headingsColor;
			text-rendering: optimizelegibility; // Fix the character spacing for headings
			small {
				font-weight: normal;
			  	line-height: 1;
			  	color: @grayLight;
		  	}
		}

		h1, .h1, h2, .h2 { line-height: @baseLineHeight * 2; }

		h3, .h3 { line-height: @baseLineHeight * 1.5; }

		h1, .h1 { font-size: @baseFontSize * 2.75; } // ~38px
		h2, .h2 { font-size: @baseFontSize * 2.25; } // ~32px
		h3, .h3 { font-size: @baseFontSize * 1.75; } // ~24px
		h4 { font-size: @baseFontSize * 1.25; } // ~18px
		h5 { font-size: @baseFontSize; }
		h6 { font-size: @baseFontSize * 0.85; } // ~12px

		h1 small { font-size: @baseFontSize * 1.75; } // ~24px
		h2 small { font-size: @baseFontSize * 1.25; } // ~18px
		.h3 small, h3 small { font-size: @baseFontSize; }
		h4 small { font-size: @baseFontSize; }

		p {
			.hyphens();
			margin: 0 0 @baseLineHeight / 2;
		}

		em {
			font-style: italic;
		}

		b, strong {
			font-weight: bold;
		}

		cite {
			font-style: normal;
		}
	}
}

// Blockquotes
blockquote {
  padding: 0 0 0 15px;
  margin: 0 0 @baseLineHeight;
  border-left: 5px solid @grayLighter;
  p {
    margin-bottom: 0;
  }
  small {
    display: block;
    line-height: @baseLineHeight;
    color: @grayLight;
    &:before {
      content: '\2014 \00A0';
    }
  }

  // Float right with text-align: right
  &.pull-right {
    float: right;
    padding-right: 15px;
    padding-left: 0;
    border-right: 5px solid @grayLighter;
    border-left: 0;
    p,
    small {
      text-align: right;
    }
    small {
      &:before {
        content: '';
      }
      &:after {
        content: '\00A0 \2014';
      }
    }
  }
}

// Quotes
q:before,
q:after,
blockquote:before,
blockquote:after {
  content: "";
}

// Addresses
address {
  display: block;
  margin-bottom: @baseLineHeight;
  font-style: normal;
  line-height: @baseLineHeight;
}