/* --------------------------
 *
 * Font styles
 *
** ----------------------- */

	/* all headings */
	h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6        	{ font-family: $secondary-font; }

	/* Mobile */
	h1, .h1															{ font-size: em(25, $mobile_fsz); color: #333333; font-weight: 500; margin-bottom: 40px; padding-bottom: 40px; text-align: center; position: relative;}
	h1:after, .h1:after 											{content: ''; width: 150px; height: 4px; position: absolute; left: 0; right: 0; margin: auto; bottom:-2px; background-color: $primary-color; @include border-radius(5px);}
	h2, .h2															{ font-size: em(22, $mobile_fsz); font-weight: 300; }
	h3, .h3															{ font-size: em(21, $mobile_fsz); font-weight: 400; color: #00a275;}
	h4, .h4															{ font-size: em(20, $mobile_fsz); font-weight: 400; color: #333333;}
	h5, .h5															{ font-size: em(17, $mobile_fsz); }
	h6, .h6															{ font-size: em(17, $mobile_fsz); }

	@include media-from(m){ 
		h1, .h1														{  }
		h2, .h2														{  }
		h3, .h3														{  }
		h4, .h4														{  }
		h5, .h5														{  }
		h6, .h6														{  }
	}

	@include media-from(l){ 
		h1, .h1														{ font-size: em(50, $desktop_fsz); }
		h2, .h2														{ font-size: em(30, $desktop_fsz); }
		h3, .h3														{ font-size: em(22, $desktop_fsz); }
		h4, .h4														{ font-size: em(22, $desktop_fsz); }
		h5, .h5														{ font-size: em(18, $desktop_fsz); }
		h6, .h6														{ font-size: em(18, $desktop_fsz); }
	}

	.page-template-page-front										{

	/* Mobile */
	h1, .h1															{}
	h1:after, .h1:after 											{}
	h2, .h2															{}
	h3, .h3															{}
	h4, .h4															{font-weight: 700; color: $secondary-color; text-transform: uppercase; display:inline-block;}
	h5, .h5															{}
	h6, .h6															{}

	h4.primary 														{color: $primary-color;}

	@include media-from(m){ 
		h1, .h1														{}
		h2, .h2														{}
		h3, .h3														{}
		h4, .h4														{}
		h5, .h5														{}
		h6, .h6														{}
	}

	@include media-from(l){ 
		h1, .h1														{}
		h2, .h2														{}
		h3, .h3														{}
		h4, .h4														{font-size: em(20, $desktop_fsz);}
		h5, .h5														{}
		h6, .h6														{}
	}		

	}