/* Table of Contents
––––––––––––––––––––––––––––––––––––––––––––––––––
- Gotham
- Sentinel
- Font Colors
- Font Hover Colors
- Background Colors
- Background Hover Colors
- Header Styles
*/

/* Breakpoints
––––––––––––––––––––––––––––––––––––––––––––––––––
0-374		2 columns
375-639		6 columns
640-1023	12 columns
1024-1439	12 columns
1440+		12 columns

*/

@media (min-width: 375px) {}
@media (min-width: 640px) {}
@media (min-width: 800px) {}
@media (min-width: 1024px) {}
@media (min-width: 1440px) {}

@media (max-width: 374px) {}
@media (max-width: 639px) {}
@media (max-width: 799px) {}
@media (max-width: 1023px) {}
@media (max-width: 1439px) {}

/* Wordpress Admin Bar Height-Change Breakpoints
––––––––––––––––––––––––––––––––––––––––––––––––––
0-782		46px tall
783-...		32px tall

*/

/* Gotham
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.gotham__light { /* gotham book = gotham light */
	font-family: "Gotham A", "Gotham B";
	font-style: normal;
	font-weight: 300;
}
.gotham__light-italic {
	font-family: "Gotham A", "Gotham B";
	font-style: italic;
	font-weight: 300;
}
.gotham__book {
	font-family: "Gotham A", "Gotham B";
	font-style: normal;
	font-weight: 400;
}
.gotham__medium {
	font-family: "Gotham A", "Gotham B";
	font-style: normal;
	font-weight: 500;
}
/* Sentinel
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.sentinel__book { /* sentinel medium = sentinel book */
	font-family: "Sentinel A", "Sentinel B";
	font-style: normal;
	font-weight: 400;
}

/* Font Colors
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.font-color__teal {
	color: #38A0B2;
}
.font-color__byu-blue {
	color: #002E5D;
}
.font-color__light-grey {
	color: #E5E5E5;
}
.font-color__medium-grey {
	color: #979797;
}
.font-color__dark-grey {
	color: #4A4A4A;
}
.font-color__black {
	color: #000;
}
.font-color__white {
	color: #FFF;
}

/* Font Hover Colors
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.font-hover-color__teal {
	color: #38A0B2;
}
.font-hover-color__byu-blue {
	color: #002E5D;
}
.font-hover-color__light-grey {
	color: #E5E5E5;
}
.font-hover-color__medium-grey {
	color: #979797;
}
.font-hover-color__dark-grey {
	color: #4A4A4A;
}
.font-hover-color__black {
	color: #000;
}
.font-hover-color__white {
	color: #FFF;
}

/* Background Colors
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.background-color__teal {
	background-color: #38A0B2;
	color: #FFF;
}
.background-color__byu-blue {
	background-color: #002E5D;
	color: #FFF;
}
.background-color__light-grey {
	background-color: #E5E5E5;
	color: #000;
}
.background-color__medium-grey {
	background-color: #979797;
	color: #FFF;
}
.background-color__dark-grey {
	background-color: #4A4A4A;
	color: #000;
}
.background-color__black {
	background-color: #000;
	color: #FFF;
}
.background-color__white {
	background-color: #FFF;
	color: #000;
}

/* Background Hover Colors
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.background-hover-color__teal {
	background-color: #38A0B2;
}
.background-hover-color__byu-blue {
	background-color: #002E5D;
}
.background-hover-color__light-grey {
	background-color: #E5E5E5;
}
.background-hover-color__medium-grey {
	background-color: #979797;
}
.background-hover-color__dark-grey {
	background-color: #4A4A4A;
}
.background-hover-color__black {
	background-color: #000;
}
.background-hover-color__white {
	background-color: #FFF;
}

/* Header Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.header__teal {
	color: #38A0B2;
	font-size: 3.33333rem;
	line-height: 3.33333rem;
	font-family: "Sentinel A", "Sentinel B";
	font-style: normal;
	font-weight: 400;
}
.header__black {
	color: #000;
	font-size: 3.33333rem;
	line-height: 3.33333rem;
	font-family: "Sentinel A", "Sentinel B";
	font-style: normal;
	font-weight: 400;
	margin: 0;
}
.header__white {
	color: #FFF;
	font-size: 3.33333rem;
	line-height: 3.33333rem;
	font-family: "Sentinel A", "Sentinel B";
	font-style: normal;
	font-weight: 400;
}
@media (min-width: 1024px) {
	.header__teal {
		font-size: 4rem;
		line-height: 4rem;
		letter-spacing: .02166666rem;
	}
	.header__black {
		font-size: 4rem;
		line-height: 4rem;
		letter-spacing: .02166666rem;
	}
	.header__white {
		font-size: 4rem;
		line-height: 4rem;
		letter-spacing: .02166666rem;
	}
}
.header__black__sub-text {
	font-family: "Gotham A", "Gotham B";
	font-style: normal;
	font-weight: 500;
	color: #979797;
	font-size: 1.333333rem;
	line-height: 1.333333rem;
	letter-spacing: -.0191666666rem;
	text-transform: uppercase;
}

/* Body Copy Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.body-copy__standard p, .body-copy__standard li {
	font-family: "Gotham A", "Gotham B";
	font-style: normal;
	font-weight: 400;
	font-size: 1.33333rem;
	line-height: 2.66666rem;
	word-wrap: break-word;
	letter-spacing: -.3px;
}
.body-copy__standard ul {
	margin-left: 3rem;
}
.body-copy__standard a {
	color: #38A0B2 !important; /* If we ever go through and take out the inline styling on the backend of Wordpress we can make this not !important.  Waiting for Aleni to respond so we can know how to do that - B. Davis 8/11/17*/
	font-family: "Gotham A", "Gotham B";
	font-style: normal;
	font-weight: 500;
}
.body-copy__standard h3 {
	font-family: "Gotham A", "Gotham B";
	font-style: italic;
	font-weight: 400;
	font-size: 1.7rem;
	line-height: 4rem;
}
.body-copy__standard strong, .body-copy__standard b {
	font-family: "Gotham A", "Gotham B";
	font-style: normal;
	font-weight: 500;
}

/* Body Copy Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.blur {
    filter: blur(5px);
    -webkit-filter: blur(5px);
    -moz-filter: blur(5px);
    -o-filter: blur(5px);
    -ms-filter: blur(5px);
}
.fade-out {
	display: none;
}
.fade-out::after {
	content: "";
	text-align: right;
	position: absolute;
	bottom: 0;
	right: 0;
	background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1) 50%);

	/* These two properties should be change based on the text being faded out */
	width: 20%;
	height: 1rem;
}
