/* custom styles by amazon pixels */
/* My Father's Name doc release 2024 */
/* Phone First -- see Media Queries end of doc */

body, html {margin:0 !important; padding: 0 !important; }

body {font-family: "Merriweather", serif;font-weight: 400;font-style: normal;font-size: 1em;}

.screeningroom {background-color: #0D0D0D;color: white;margin:0;padding: 0;border-top: 0;border-bottom: 0;}
.poster {background-color: #0D0D0D; color: white;}

nav {font-family: "Oswald", sans-serif;text-transform: uppercase;}

/* TYPOGRAPHY */
h1, h2, h3 {
  	font-family: "Oswald", sans-serif;
	font-optical-sizing: auto;
	}

h2 {
	text-transform: uppercase;
  	font-weight: 400;
  	margin: 2rem 0; /* no left/right space */
  	font-size: 2.15em; /* font-size: 2.25em; */
}

h3, .callout {
  	font-size: 1.75em; /* font-size: 1.85em; */
  	font-weight: 300;
}

button, .button {
	font-family: "Merriweather Sans", sans-serif;
	text-transform: uppercase;
	letter-spacing: .05em;
}

/* let's have a scalable to viewport alt Header sizing */
.h1 {font-size: 5vw; 
	font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  }
.h2 {font-size: 4.5vw;}
.h3 {font-size: 1.75em; /*font-size: 3.5vw;*/}
.h4 {font-size: 1.5rem;}

.caption {font-family: "Merriweather Sans", sans-serif;}
.sans {font-family: "Oswald", "Merriweather Sans", sans-serif; font-size: 1.25em;}
.tagline { font-family: "Oswald", sans-serif;
	line-height: 1.25;
	font-size: 3em;
	border: 0px solid #fff;
	/* font-family: "Merriweather Sans", sans-serif; */
	/*letter-spacing: .01em;*/
	text-align: center;
	color: #ff3333; 
  }
.x {font-size: 2em; padding: .5em;}
.boldtxt {font-weight: 700;}
.film-title {text-transform: uppercase;}
.fa {font-size: 2.5rem; margin: 1%;} /* for font icons */
.scaletext {font-size:calc(10px + 1vw);}
.surname {white-space: nowrap;}

/* LINKS default link colors  */
a {
  outline-color: transparent;
}

a:link {
  color: #fff; /* purple #6900ff*/
}

a:visited {
  color: #fff; /* light purple #b3bdd8 */
}

a:focus {
  text-decoration: none;
  background: inherit;
}

a:hover {
  text-decoration: underline;
  background: inherit;
}

a:active {
  background: inherit;
  color: maroon; 
}


.button {
	border: thin solid #fefefe;
	display:inline-block;
	padding: 8px 16px;
	vertical-align:middle;
	overflow:hidden;
	text-decoration:none;
	background-color: rgba(255, 255, 255, .35); /* white/black transparent */
	text-align:center;
	cursor:pointer;
	white-space:nowrap;
	color: white;
}

.big-button {border: thin solid #efefef; font-size: 1rem;}

button:hover {text-decoration: none; opacity: 1; background-color: rgba(255, 255, 255, .1); /* white/black transparent */}

a.button:hover {text-decoration: none; opacity: 1; background-color: rgba(255, 255, 255, .1); /* white/black transparent */}

.no-button {display: inline; background: none; border: 0; font-size: 1rem; font-weight: 600; color: maroon; cursor:pointer;}

.button-row button {margin: .5rem .75rem 0 0;}

/* IMAGES */
img.poster{max-width: 640px; border: thin solid #efefef;}
img.responsive {width: 100%; height: auto;}
a img.dim:hover {opacity: .75;}
a img:hover {transform: scale(0.99);}

/* IN THE PRESS BLOCKQUOTES */
#praises {font-family: "Oswald", sans-serif;}
#praises blockquote p {font-size: 2.35rem; line-height: 1.5;} /* was 2em */
#praises blockquote cite {font-style: italic; font-weight: 300;}

.pull-quote {
  padding: 0;
  margin: 0 auto;
  border-left: 0;
  }
  
.pull-quote > p {
    margin-top: 20px; 
    margin-bottom: 10px;
    text-align: center; 
    text-transform: uppercase;
    }
  
 /* .pull-quote > img {
    width: 60px;
    height: 75px;
     }*/
 
 /* quote colors controlled in color section */    
 
  .pull-quote > cite {
    display: block;
    /* margin-top: 5px; */
    font-size: 1.85rem;
    letter-spacing: .1em;
    /* color: #A9A8A9; text-transform: uppercase; */
    text-align: right; 
    }
    
   .pull-quote > p:before {
   } 

q, .q {
	quotes: "\201C" "\201D" "\2018" "\2019";
}
q::before,.q::before {
    content: open-quote;
    /* color: #A9A8A9; */
}
q::after,.q::after {
    content: close-quote;
    /* color: #A9A8A9; */
}

.blockquote-footer::before {
  content: "\2014 \00A0";
}

/* COLORS */
.newsprint {background-color: #f0d6ba; color:#0D0D0D;} /* RGB 240,214,186 */
.newsprint-light {background-color: #fff7Ef;}
.newsprint a {text-decoration: none;}
.newsprint a:link {font-weight: 600; color: #841517;} /* red #de383c low contrast replace w/ maroon */
.newsprint a:active {font-weight: 500; color: #841517;} /*  */
.newsprint a:hover, .no-button:hover {text-decoration: underline;}
.newsprint a:visited {font-weight: 400; color: #841517;} /* */

/* backgrounds */
.bloodred {background-color: #940003; color: white;} /* HEX#1 #de383c (#cc3333) background-color: rgba(222,56,60,1); */
.blackish {background-color: #0D0D0D; color: white;}
.orange {background-color: #D97218; color: white;}
.white {background-color: #ffffff; color: #0D0D0D;}

/* text colors */
.newsprinttxt {color: #f0d6ba;}
.maroontxt {color: #841517;}
.redtxt {color: #ff3333;}

/* purple  #6900ff*/
 /* light  purple #b3bdd8 */
 
/* EVENTS */
#events {}
.event {font-family: "Oswald", sans-serif;}
.event-title {font-weight: 400; margin: .5rem 0;}
.event-info > p {margin: .5rem 0; font-weight: 300; font-size: 1.25em;}
.event-detail {}
.event-date {}
.event-lacation {}
.event-link {text-align: center;}
.event-image {padding: 1rem; margin: 0 auto;}
/* treat linked image border like button */
.event-image img {border: thin solid #efefef;}

/* BASIC LAYOUT DEFAULTS */

.container {margin: 0 auto; padding: 0% 0%; max-width: 1120px;}
.content {padding: 1% 2%; border: 0px solid #fff;}
.copy {margin: 4% auto; padding: 0 4%; max-width: 920px; border: 0px solid #fff; }

.panel {margin-top: 1%; margin-bottom:1%;}
.laurels {margin: 2%;}

.caption {margin-top: 1%;}

/* HEADER + FOOTER */

.anchor-pad {	
	padding-top: 2em;
	padding-bottom: 2em;
	scroll-margin-top: 1em;
	}

header{
	/*padding: 1rem 1rem 1rem 1rem;*/
	/* see #top-bar */
}

#top-bar {width: 100%; height: 100% !important; border: 0px solid #fff;}

#title-bar {margin-top: 0px; width: 100%; height: 100% !important; border: 0px solid #fff;}

.sticky {  
	position: -webkit-sticky; /* Safari */
	position: sticky;
	top: 0 !important;
	left: 0;
	width: 100%;
	height: auto !important;
	margin: 0 auto !important;
	z-index: 100;
	border: 1px solid rgba(0, 0, 0, 0.2);
	/*box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);*/
}

.clear-sticky {
	padding-top: 1em; /* was 2em*/
	padding-bottom: 1em; /* was 2em*/
	scroll-margin-top: 1em; /* was 5em then 9em for tall */
}


/* not used */
.icon svg {
  width: 100% !important;
  height: 100% !important;
}

header h1 {
	font-family: "Times New Roman", serif;
	letter-spacing: normal;
	font-weight: 600;
	font-style: normal;
	font-size: 3vw;
	/* font-optical-sizing: auto; */
	margin: 0 auto;
	line-height: 1;
	padding: 0 !important;
	/*white-space: nowrap; */
	border: 0px solid #ccc;
}


h1.brand {text-align: center;}

h1.brand img {
	width: 100%; 
	height: 100%;
	max-width: 980px;  /* adjusted for laptop container constraints */
	z-index: 1;
	border: 0px solid #fff;
	margin: 0 0;
	padding: .5rem 3rem 0rem .5em;
}

.creditline {   
	font-family: "Oswald", sans-serif;
	font-size: 2rem;
	line-height: 1;
	border: 0px solid #fff;
	margin: 0 .45rem .45rem .45rem;
	padding: 0;
}


#logo {transition: height 0.3s ease;}

/* NAVIGATION W/HAMBURGER NAV */


/* top left dim effect  */
.overlay{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    visibility: hidden;
    transition: opacity .35s, visibility .35s, height .35s;
    overflow: hidden;
    background: black;
    z-index: -1;
}

/* nav */
#main-menu {
  display: block;
  height: auto;
  /* width: 100% !important; margin: 0 0 0 2em; */
  border: 0px solid #cff;
  z-index: 11;
}

#main-menu ul {
  max-width: 1120px;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  padding: 0;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  border: 0px solid #fff;
  z-index: 101;
}

#main-menu li {
	list-style-type: none;
	margin: 0 .15rem;
	padding: 0 1%;
	border: 0px solid #000;
	/*font-weight: 400;
	font-style: normal;
	font-size: 1rem; 
	line-height: 1;*/
	white-space: nowrap;
}

#main-menu a {
	text-decoration: none;
}

#main-menu a:hover {
  text-decoration: underline;
}

#hamburger-input{
  display: none;
}

#hamburger-menu {
   position: absolute;
    top: 1.25rem;
	right: 1%;
    width: 1.75rem;
    height: 1.75rem;
    display: none;
    border: none;
    padding:8px;
    margin: 0px;
    margin-left: 8px !important;
    margin-right: 8px !important;
   /* font-family: "Barlow Semi Condensed", sans-serif; */
    background: linear-gradient(to bottom, 
    white, white 20%, 
    transparent 20%, transparent 40%, 
    white 40%, white 60%, 
    transparent 60%, transparent 80%, 
    white 80%, white 100%
    );
    border: 0px solid #c00;
}

#hamburger-menu #sidebar-menu {
    visibility: hidden;
    position: fixed;
    top: 0;
    right: -250px;
    width: 200px;
    height: 100%;
    /*background-color: #d2622f;  l orange  */
    background-color: #f0d6ba; 
    color:#0D0D0D;
    transition: 0.3s;
    padding: 0px 10px;
    box-sizing: border-box;
}

#hamburger-menu h3 {
	color:#0D0D0D;
  	font-size: 3rem;
  	margin: 0 10px;
  	text-align: right;
}

#hamburger-menu ul {
  padding-left: 0px;
}

#hamburger-menu li {
  list-style-type: none;
  line-height: 2;
}

#hamburger-menu a {
   color:#0D0D0D;
  font-size: 1.3rem;
  text-decoration: none;
}

#hamburger-menu a:hover {
  text-decoration: underline;
}

#hamburger-input:checked + #hamburger-menu #sidebar-menu {
    visibility: visible;
    right: 0;
    z-index: 101;
}

#hamburger-input:checked ~ .overlay{
   visibility: visible;
  opacity: 0.4;
}

/* let's make sure the video doesn't cover the side-menu */

#watch iframe {border: 0px solid #fff; z-index: 99;}

footer h4, footer .fa {border:0px solid #CCCCCC;}
footer h4, footer h3 {margin: 0;}

.block-center {display: block; margin: 0 auto!important;}

.text-center {text-align: center;}
.text-left {text-align: left;}
.text-right {text-align: right;}
.nowrap {white-space: nowrap;}
.border-one {border: 1px solid #000;}

.p-1 {padding: 1rem;}
.p-4 {padding: 4vh 0;}
.m-p-1 {padding: 1% 0%;}
.m-t-0 {margin-top: 0;}
.m-b-0 {margin-bottom: 0;}
.m-2 {margin: 2%;}
.m-1 {margin: 1%;}

.left{float:left!important}
.right{float:right!important}

/* LIST  see media query for small mobile */
.defaultp{font-size:100%;margin:.5em;padding:.5em;}
ul.defaultp{font-size:100%;margin:.5rem;margin-left:1.5rem;margin-right:1.25rem;padding:.5rem;}
ul.defaultp li{padding:.5rem;}



/* PHOTOS - IMAGES */
figure {
 /*border: thin #222 solid;*/
  display: flex;
  flex-flow: column;
  padding: 5px;
  max-width: 800px;
  margin: auto;
}

figcaption {
  background-color: #222;
  color: #fff;
  font: normal small sans-serif;
  padding: .5rem;
  text-align: center;
  line-height: 1rem;
}

.art-back {
	background-image: url('');
	background-repeat: no-repeat;
	background-size: 25%;
	background-position: 90% 25%;
}

/* see xsmall device rules below  */

.credits{text-align:center; font-size: .80rem; border:0px solid #CCCCCC;}

/* see brand h1 warp on small devices below */


/* GRIDS 3 column - USED FOR PARTNERS */
.grid-container {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
	column-gap: 1.25rem;
	row-gap: 1.25rem;
	align-items: center;
	/* background-color: #ededed; */
	padding: 1rem;
	margin: 4%;
	grid-template-rows: auto; /* auto height */
	grid-auto-flow: dense;
	border: 1px solid #ccc;
}

.grid-container-kit {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	column-gap: .5rem;
	row-gap: .5rem;
	align-items: center;
	/* background-color: #ededed; */
	padding: 0rem;
	margin: 0;
	grid-template-rows: auto; /* auto height */
	grid-auto-flow: dense;
	border: 0px solid #ccc;
}

.grid-container-gallery {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
	grid-template-rows: masonry;
	column-gap: 1px;
	row-gap: 1px;
	align-items: center;
	/* background-color: #ededed; */
	padding: 0rem;
	margin: 0%;
	grid-auto-flow: dense;
	border: 0px solid #ccc;
}
/* make 2 columns on mobile */
@media screen and (max-width: 600px) {
.grid-container-gallery {
   /* grid-template-columns: repeat(2,minmax(auto, 1fr)); */
    }
  }

/* GRIDS 2column - USED FOR TWO COLUMNS SECTION */
.grid-container-two {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	column-gap: 1.6rem;
	row-gap: 1rem;
	align-items: center;
	/* background-color: #ededed; */
	padding: 0rem;
	margin: 0;
	grid-template-rows: auto; /* auto height */
	grid-auto-flow: dense;
	border: 0px solid #ccc;
}


/* EVENTS LIST */

.flex-container {
  display: flex;
  flex-direction: row;
  margin: 2% 0%;
}

.row {margin: 1rem auto;}
.col {padding: .5rem .5rem;}
.border .col{ border:1px solid #c00;}

/* EVENTS FLEX BOXES */
.event-image {display: flex; max-width: 240px; align-items: center; justify-content: center;}
.event-info {width: 100%; padding: 4%; justify-content: center;}
.event-link {display: flex; align-items: center; justify-content: center;}

.grid-item, .flex-box {
  background-color: rgba(0, 0, 0, 0); /* black transparent */
  border: 0px solid rgba(0, 0, 0, .1); /* black transparent */
  padding: 0;
  height: 100% !important;
  text-align: left !important;
}

.grid-item h3 {margin-top: 2px;}

.grid-item-img img{width: 100% !important; height: 100%; }
.grid-item-txt {margin: 0 0; } /* align to top of image  see copy */
.grid-item-txt p:first-child {margin-top: 0; border: 0px solid #ccc;} /* first p goes to top of box too */
.grid-item-txt p {line-height: 1.8;}

.flex-box p {margin: 2% 2%; font-size: .8rem;}


/* Responsive layout - makes a one column layout instead of a two-column layout */
@media screen and (max-width: 992px) {
  .flex-container {
    flex-direction: column;
  }
  
  .flex-container .event-info {text-align: center;}
  
  .flex-box {flex: 100%; margin: 0 auto;}
}




/* SHOW HIDE PUBLICITY IMAGES */

details {
width: 100% !important;
border: 0px solid #fff;
margin: 0;
padding: 0;
}

details > summary {
font-size: 1.25rem;
margin: 0;
padding: 0;
width: 100% !important;
border: 0px solid #fff;
cursor: pointer;
/* list-style: none; */
}

details > div {
margin: 0;
padding: 0;
border: 0px solid #ffc;
}

details > #photokit p {
border: 0px solid #ffc;
}

details[open] > summary {
  /*background-color: #ccf;*/
}

#photokit {width: 100% !important; border: 0px solid #c00; margin: 0 3px; padding: 0; }

/* video */

/* Full-width video */
/* max-width * aspect-ratio */
.full-width {
  width: 100vw;
  /* max-width: 90%;*/
  height: calc(100vw * (9/16));
  max-height: 90vh;
  /* max-height: calc(30em * (9/16));*/
}

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width:600px){

	header h1 {font-size: 2rem;}
	header h2 {font-size: 1.5rem;}
	
	.h3 {3.5em;}
	.creditline {font-size: 1.5rem;}
	
	#praises blockquote p {font-size: 1.5rem;}
	#praises blockquote cite {font-size: 1.25rem;}
	.tagline {font-size: 2rem;}
	
	ul.defaultp{margin:.5rem;margin-left:1rem;margin-right:.15rem;padding:.5rem;}
	ul.defaultp li{margin: 0; padding:.5rem;} 
	
	.hide-xsm {display: none !important;}
	.opener::before {content:"[View Kit]";}
	.opener{cursor: pointer; padding: 1.5rem;}
	.closer::before {content:"[Hide Kit]";}
	.closer{cursor: pointer; padding: 1.5rem;}
	
	/* don't show the soldier art */
	.soldier-art-back {background-image:none;}
	.laurels {max-height: 75px;}
	.laurels.circle {max-height: 120px; max-width: 120px;}
	.col {padding: .5em 0;}
}

@media only screen and (orientation: landscape) {
  body {
    background-color: black;
  }
}

/* Small devices (portrait tablets and large phones, 600px and up) */

@media (max-width:992px)and(min-width:601px){
.hide-medium{display:none!important}
.orange-border {		
	border-left-width: 7vw;
	border-right-width: 7vw;
	}
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
}

/* Medium devices (landscape tablets, 768px and up) */
@media screen and (max-width: 992px) {
	#main-menu {display: none;}
	#hamburger-menu {display: inline;}
	.clear-sticky {
	padding-top: 1em; /* was 2em*/
	padding-bottom: 1em; /* was 2em*/
	scroll-margin-top: 1em; /* was 5em */
	}
}

/* Large devices (laptops/desktops, 992px and up) */
@media screen and (min-width: 992px) {
	.show-large {visibility: visible;}
	.hide-large{display:none!important}
	.orange-border {
		border-left-width: 15vw;
		border-right-width: 15vw;
	}

.fullvideo {height: 100vh; width: auto;}

.container {max-width: 960px;} /* because of the video on laptop */
h1.brand img {padding: .5rem 0 0 0;}

}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
#praises {border: 0px solid #ccf;}
}