@font-face {
	font-family: 'Minion Pro Medium';
	font-style: normal;
	font-weight: normal;
	src: url(fonts/MinionPro/MinionPro-Medium.woff) format('woff');
}

@font-face {
	font-family: "Freight Sans Compressed Pro Medium";
	src: url(fonts/FreightSansCmpProMedium/freightsanscmppro-med-webfont.woff2) format('woff2'),
		url(fonts/FreightSansCmpProMedium/freightsanscmppro-med-webfont.woff) format('woff'),
		url(fonts/FreightSansCmpProMedium/freightsanscmppro-med-webfont.ttf) format('truetype');
}

body {
    color: #bfcbcb;
	/*background: #140b08 url("../img/bg-texture.jpg") center repeat-y;*/
    background: #140b08;
    font-family: "EB Garamond", "Times New Roman", Times, serif;
  	font-optical-sizing: auto;
  	font-weight: 400;
  	font-style: normal;
}

a:not(.btn) {
    text-decoration: none;
}

a:not(.btn):hover {
    text-decoration: underline;
}

p {
    font-size: 1.125rem;
}

.text-bg-hillsdale-dark {
    color: #fff;
    background-color: #140b08;
    background-color: #131317;
}

.text-bg-hillsdale-dark a {
    color: #fff;
}

audio {
    width: 100%;
}

.text-minion-pro-medium {
    font-family: 'Minion Pro Medium', 'Times New Roman', Times, serif;
    font-weight: normal;
}

.img-eagle {
    margin-bottom: .5rem;
    height: .75rem;
}

@media(min-width: 768px) {
    .img-eagle {
        margin-top: 5rem;
    }
}

/* header image */

.center-absolute {
    left: 50%;
    transform: translateX(-50%);
}

.center-margin {
    margin-left: 50%;
    transform: translateX(-50%);
}

.mask-header {
    mask-image: linear-gradient(#000 80%, transparent);
    z-index: -1;
}

/* text */

.text-hillsdale {
    font-variant: small-caps;
    letter-spacing: .18em;
    font-size: .75rem;
}

.text-smallcaps {
    font-variant: small-caps;
}

.title-revolutionary {
    width: 90%;
    max-width: 397px;
}

.title-revolutionary-promo {
    margin-top: 3rem;
    width: 397px;
    max-width: 65%;
}

.text-coming {
    display: inline-block;
    margin-top: 1rem;
    padding: .3rem 1rem .1rem;
    font-size: .875rem;
    background: rgba(33,20,8,.7);
}

@media(min-width: 768px) {
    .title-revolutionary-promo {
        margin-top: 75px;
        width: 397px;
        max-width: 100%;
    }

    .text-coming {
        background: rgba(33,20,8,.3);
    }
}

.title-sword {
    margin-top: 85px; /* temp */
    width: 275px;
    margin-bottom: 1rem;
}

.title-declaration {
    margin-top: 125px;
    width: 494px;
    margin-bottom: 1.25rem;
}

.title-last {
    width: 490px;
}

/* buttons */

.btn {
	text-transform: uppercase;
	font-family: "Freight Sans Compressed Pro Medium", "Helvetica Neue", Helvetica, Arial, sans-serif;
    margin-top: .125rem; /* specific to short film button */
    padding: .4rem 1rem .2rem;
	font-size: 1.35rem;
    line-height: 1;
}

.btn-primary {
	color: #fff;
	background-color: rgba(213, 196, 173, .3);
	border: 0;
}

.btn-primary:hover {
	background-color: rgba(213, 196, 173, .4);
}

.btn-primary:active {
	background-color: rgba(213, 196, 173, .2) !important;
}

.btn-primary:focus,
.btn-play:focus {
	outline: solid 2px #fff !important;
	box-shadow: none;
}

.btn-primary:focus {
	background-color: rgba(213, 196, 173, .2) !important;
}

.btn-play,
.btn-play-audio {
	border: 0;
	background-color: rgba(255,255,255,.3);
	border-radius: 50%;
	height: 64px;
	width: 64px;
	z-index: 1;
	justify-content: center;
	align-items: center;
	display: flex;
}

.btn-play-audio {
    position: relative;
}

.btn-play-audio img {
    position: absolute;
    top: -8px;
    left: 9px;
    width: 85px;
    height: 61px;
    line-height: 85px;
}

.btn-play:hover {
	background-color: rgba(255, 255, 255, .7);
}

/* quote */

.blockquote-footer {
	color: #bfcbcb;
    font-size: .9rem;
}

.blockquote-footer::before {
	content: "";
}

.blockquote-footer cite {
	display: block;
	font-size: .765rem;
    margin-top: -.1875rem;
}

/* letter */

.letter {
    background: url("../img/bg-splat.webp");
    background-size: cover;
    background-repeat: none;
}

/* footer */

footer {
    background-color: #131317;
}

.img-logo {
    margin-bottom: 2.125rem;
    max-height: 56px;
}

footer .nav + .nav {
    margin-top: 2rem;
}

footer .nav-item {
    line-height: 1.2;
}

footer .nav-link {
	padding: 0;
    /*text-decoration: underline;*/
}

footer .nav-link:hover {
    text-decoration: underline;
}

footer h3 {
    font-family: "Arial Black", Arial, Helvetica, sans-serif;
    font-size: 1rem;
}

.nav-social {
    margin-top: 1.75rem;
    margin-bottom: .5rem;
}

.nav-social .nav-item {
    margin-right: .5rem;
    margin-left: .5rem;
    font-size: 1.75rem;
}

/* img links */

.img-link {
    position: relative;
}

.img-link-hover {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition: .2s ease-in-out;
}

.img-link:hover .img-link-hover {
    opacity: 1;
}

@media(min-width: 768px) {
    .mw-md-450 {
        min-width: 450px;
    }

    .mw-500 {
        max-width: 500px;
    }

    .mw-640 {
        max-width: 640px;
    }

    .border-md-start {
        border-left: 1px solid transparent;
    }
}

@media(min-width: 768px) {
    .position-absolute-md {
        position: absolute;
    }
}

.bg-my-gradient {
    background: linear-gradient(transparent 20%, rgba(21,12,6,.7));
}

/* over 1920 fades */

@media(min-width: 1921px) {
    .mask-header {
        mask-image: radial-gradient(farthest-side circle at top, #000 60%, transparent);
    }

    .blend {
        position: fixed;
        background: linear-gradient(90deg, #140b08, transparent 15%, transparent 85%, #140b08);
        height: 100vh;
        width: 1920px;
        left: 50%;
        transform: translateX(-50%);
        z-index: -1;
    }

    .mask-1920 {
        mask-image: linear-gradient(90deg, transparent, black 15%, black 85%, transparent);
    }

    footer {
        margin: 0 auto;
        max-width: 1920px;
        background: linear-gradient(90deg, #140b08, #131317 15%, #131317 85%, #140b08);
    }
}

.mobile-crop {
    z-index: -1;
}

@media(max-width: 767px) {
    .mobile-crop img {
        object-fit: cover !important;
        height: 500px !important;
    }    
}

@media(max-width: 1920px) {
    .mobile-crop {
        height: 970px;
        overflow-x: hidden;
    }

    .mobile-crop img {
        object-fit: none;
        object-position: top;
    }
}


/* hover videos */

.hover-box {
    position: relative;
}

.hover-box > img {
    width: 100%;
    opacity: .22;
    transition: opacity .2s ease-in-out, filter .2s ease-in-out;
}

.hover:hover > .hover-box > img {
	opacity: .22;
    filter: grayscale(25%) saturate(75%) blur(.5px);
}

.hover-red {
	background-color: #733245;
}

.hover-white {
    background-color: #666;
}

.hover-blue {
    background-color: #2a335f;
}

.caption {
    position: absolute;
    bottom: 0;
    width: 100%;
}

.caption p {
    font-size: 2rem;
    line-height: 1;
    color: #fff;
}

.caption p.cite {
    font-size: 1rem;
    color: #e8d9c5;
}

.hover:hover .caption {
    display: block;
}

@media(min-width: 768px) and (max-width: 991px) {
    .caption p {
        font-size: 1.25rem;
    }

    .caption p.cite {
        font-size: .875rem;
    }
}

@media(min-width: 1200px) {
    .hover-box > img {
        opacity: 1;
    }

    .caption {
        display: none;
    }
}

/* parallax */

.foreground {
    z-index: 1;
}

.background {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    background: url("../img/bg-texture.jpg") center repeat-y;
    width: 100%;
    max-width: 1920px;    
    overflow-x: hidden;
    z-index: -1;
}

.bg-letter {
    margin-top: 500px;
    width: 1168px;
    opacity: .5;
}

.bg-declaration {
    margin-top: -100px;
    width: 1268px;
}

.bg-map {
    margin-top: 500px;
    width: 1076px;
    opacity: .9;
}

@media(max-width: 767px) {
    .header-temp .float-md-end {
        min-height: 300px;
    }

    .bg-letter {
        margin-top: 50vh;
    }

    .bg-declaration {
        margin-top: 100vh;
    }

    .bg-map {
        margin-top: 125vh;
    }
}

@media(min-width: 768px) {
    .bg-letter-temp {
        margin-top: 700px;
    }

    .header-temp {
        min-height: 512px;
    }
}