/* CSS Document */

/* 
	CSS stylesheet for 2nd version of OGW site, 2022 
*/

html, body, table, th, tr, td, p, img, hr, ul, li, h1, h2, h3, h4, h5, div, form, fieldset {padding:0; margin:0; border:none;}

@media screen and (-webkit-min-device-pixel-ratio:0) {
    html, body, table, th, tr, td, p, img, hr, ul, li, h1, h2, h3, h4, h5, div, form, fieldset {padding:0; margin:0; border:none;}
    h1 {font-weight:normal;}
}

div { position: relative; }

:root {
    font-size:17px;
    --basic_font_size: 17px;
    --lt_grey:#b2b0a9;
    --warm_grey:#ccc7bf;
    --med_grey:#979797;
    --dk_grey:#6c6b66;
    --red:#c31313;
    --teal:#24b59f;
    --beige:#fbf4ce;
    --blue:#1072b8;
}

html { width:100vw; height:100vh; }

body { 
    width:100%; 
    height:100%; 
	overflow-x: hidden;
    font-family:'Roboto Serif', serif;
    font-weight:300;
    color:#000000;
	background-color: #efeae3;
}

.float_l { float:left; }
.float_r { float:right; }
.clear_l { clear: left; }
.clear_r { clear: right; }
.clear_both { clear:both; }
.hidden { display:none; }
.bold { font-weight:700; }
.sp_after_12 { margin-bottom:12px; }

div#nav_bar {
	width:100%;
	height:80px;
	background-color:rgba(255,255,255,.70);
	position: absolute;
	top:0; left:0;
	z-index:500;
	display:flex;
	justify-content: right;
}

div#outer_wrap {
	width:1440px;
	height:100vh;
	margin:0 auto;
	background-color: white;
	overflow:auto;
}

div#inner_wrap {
	width:calc(100% - 160px);
	padding:80px;
	position: absolute;
	left:0;
	top:80px;
}

div#home_key_art {
	width:100%;
	max-width:1440px;
	height:100%;
	position: absolute;
	top:0; left:0;
	background-image:url('../_img/ogw_key_art_2_wLogo.jpg');
	background-repeat: no-repeat;
}

div#home_logo {
	width:474px;
	height:314px;
	background-image:url('../_img/ogw_logo_lg_flushR.png');
	background-repeat: no-repeat;
	position:absolute;
	top:269px;
	left:101px;
	z-index:100;
}

div#short_thumb {
	width:410px;
	height:160px;
	position:absolute;
	top:670px;
	left:165px;
	background-image:url('../_img/short_thumbnail+type.png');
	background-repeat: no-repeat;
	cursor: pointer;
	z-index:100;
}

div.nav_item {
	width:auto;
	height:80px;
	padding:0 45px;
	font-family:'Roboto Condensed';
	font-size:1.2rem;
	font-weight: 400;
	line-height:80px;
	text-align: center;
	letter-spacing: 1px;
	color:#737373;
	cursor: pointer;
	float:left;
}

div.nav_item:hover {
	color:black;
}

div.donate {
	font-weight:400;
	color:white;
	background-color:var(--teal);
}

div#footer {
	font-family:'Roboto Condensed';
	font-size:.7rem;
	font-weight: 400;
	text-align: right;
	letter-spacing: 1px;
	text-transform:uppercase;
	color:#737373;
	width:1420px;
	margin:0 auto;
	bottom:30px;
	padding:0 20px 0 0;
}

div#l_col {
	width:50%;
	float:left;
}

div#r_col {
	width:calc(50% - 80px);
	margin-left:80px;
	float:left;
}

a {
	text-decoration: none;
	color:inherit;
}

a:hover {
	text-decoration:underline;
}

h1 {
	color:var(--red);
	font-size:2rem;
	margin-bottom: 2rem;
}

p {
	color: var(--dk_grey);
	line-height: 1.5rem;
	margin-bottom:1.2rem;
}

p.large_text {
	font-size:1.5rem;
	line-height:2rem;
	margin-bottom:3rem;
}

p.p_break {
	padding-top:1.2rem;
	border-top:1px solid var(--med_grey);
}

span.title {
	font-weight:700;
	font-style: italic;
}

p.log_line {
	margin-left:60px;
	font-weight:700;
	color:var(--red);
}

img.still {
	width:calc(100% - 2px);
	margin-bottom:20px;
	border:1px solid var(--med_grey);
}

img.director_photo {
	width:300px;
	float:right;
	margin: 0 0 30px 30px;
}

div.team_wrap {
	width:100%;
	margin:20px 0 20px 0;
	overflow:auto;
	border-bottom:1px solid var(--red);
}

div.team_wrap:first-of-type {
	margin-top:0;
}

div.team_headshot {
	width:230px;
	float:left;
	margin:0 30px 30px 0;
}

div.team_bio {
	width:calc(100% - 260px);
	float:left;
	
}

h3 {
	font-family: 'Roboto Condensed';
	font-size:1.2rem;
	font-weight:400;
	letter-spacing: 2px;
	color:var(--med_grey);
	margin-bottom:1rem;
}

span.team_name {
	font-weight:700;
	color:var(--red);
	font-size:1.5rem;
}

div#blocker {
    width:100vw;
    height:250vh;
    background-color:black;
    opacity:0.7;
    position:absolute;
    top:0;
    left:0;
    z-index:1000;
}

div#video_lg_wrap {
    width:1200px;
    height:675px;
    z-index:10000;
    position: absolute;
    top:8vh;
    left:calc(50% - 600px);
    -webkit-box-shadow: 0 10px 24px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 0 10px 24px 0px rgba(0,0,0,0.5);
    box-shadow: 0 10px 24px 0px rgba(0,0,0,0.5);
}

video#video_large {
    width:100%;
}

div#BUT_close {
    width:34px;
    height:45px;
    overflow: hidden;
    position:absolute;
    top:0;
    right:-44px;
    background:url('../_img/BUT_close.png') no-repeat top center;
    cursor:pointer;
}

div#BUT_close:hover {
    background-position-y:-45px;
}


/* FOR RETINA DISPLAYS: */
@media only screen and (min--moz-device-pixel-ratio: 2),
only screen and (-o-min-device-pixel-ratio: 2/1),
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-device-pixel-ratio: 2) {

	body {
		height:200vh;
	}
	
	div#outer_wrap {
		width:1200px;
		height:150vh;
	}
	
	div#nav_bar {
		height:60px;
	}
	
	div.nav_item {
		height:60px;
		padding:0 25px;
		line-height:60px;
	}

	div#home_key_art {
		background-position: 0 -50px;
	}
	
	div#short_thumb {
		top:570px;
	}
	
	div#footer {
		width:1180px;
	}

}