@charset "utf-8";
/* betweenspiritandstonethefilm.com */

@font-face {
    font-family: opensans;
    src: url('fonts/OpenSans-Regular.woff2') format('woff2'),
        url('fonts/OpenSans-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: opensans;
    src: url('fonts/OpenSans-Bold.woff2') format('woff2'),
        url('fonts/OpenSans-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: opensans;
    src: url('fonts/OpenSans-Italic.woff2') format('woff2'),
        url('fonts/OpenSans-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: opensans;
    src: url('fonts/OpenSans-Light.woff2') format('woff2'),
        url('fonts/OpenSans-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: opensans;
    src: url('fonts/OpenSans-LightItalic.woff2') format('woff2'),
        url('fonts/OpenSans-LightItalic.woff') format('woff');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: opensans;
    src: url('fonts/OpenSans-ExtraBoldItalic.woff2') format('woff2'),
        url('fonts/OpenSans-ExtraBoldItalic.woff') format('woff');
    font-weight: 800;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: opensans;
    src: url('fonts/OpenSans-SemiBoldItalic.woff2') format('woff2'),
        url('fonts/OpenSans-SemiBoldItalic.woff') format('woff');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: opensans;
    src: url('fonts/OpenSans-SemiBold.woff2') format('woff2'),
        url('fonts/OpenSans-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: opensans;
    src: url('fonts/OpenSans-ExtraBold.woff2') format('woff2'),
        url('fonts/OpenSans-ExtraBold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: opensans;
    src: url('fonts/OpenSans-BoldItalic.woff2') format('woff2'),
        url('fonts/OpenSans-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: vtypew;
    src: url('fonts/VTypewriter-UnderwoodPortable.woff2') format('woff2'),
        url('fonts/VTypewriter-UnderwoodPortable.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}



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

body {
	color:#000;
	}

a {
	color:#fff;
	text-decoration:underline;
}

a:hover {
	color:#fff;
	text-decoration:underline;
}

a:visited {
	color:#fff;
}

* {
    box-sizing: border-box;
}

img {
	opacity:0.999;
	filter:alpha(opacity=99.99);
}

a:hover img {
	opacity:0.8;
	filter:alpha(opacity=80);
}

img {
	border:0;
}

a, a img {
	border:0;
}

a:focus {
	/*outline: none;*/
}

.img100 {
	width:100%;
}

.img90 {
	width:90%;
}

.img80 {
	width:80%;
}

.img70 {
	width:70%;
}

.img70c {
	display:block;
	width:70%;
	margin:0 auto;
}

.img50 {
	width:50%;
}

.img50c {
	display:block;
	width:50%;
	margin:0 auto;
}

.img50l {
	float:left;
	width:50%;
	margin:0 1em .2em 0;
}

.img50r {
	float:right;
	width:50%;
	margin:0 0 .2em 1em;
}

.img40 {
	width:40%;
}

.img30 {
	width:30%;
}

.img30l {
	float:left;
	width:30%;
	margin:0 1em .2em 0;
}

.img30r {
	float:right;
	width:30%;
	margin:0 0 .2em 1em;
}

.img20 {
	width:20%;
}

.img10 {
	width:10%;
}

.clearboth {
	display:block;
	clear:both;
}

.vertalign {
	position: relative;
	top: 50%;
    transform: translateY(-50%);
}

.overlayholder {
	display:block;
	display:none;
	position:fixed;
	top:0;
	bottom:auto;
	right:auto;
	left:0;
	width:100%;
	height:100%;
	padding:0;
	margin:0;
	z-index:9999;
	background:rgba(0,0,0,0.85);
	border:none;
}

.videooverlay {
	display:block;
	position:absolute;
	top:10%;
	bottom:auto;
	right:auto;
	left:5%;
	width:90%;
	padding:2em 0 0 0;
	margin:0;
	text-align:right;
}

.closeoverlay {
	position:absolute;
	display:block;
	top:0;
	bottom:auto;
	right:0;
	right:auto;
}

.closeoverlay a {
	font-size:1.2em;
	font-weight:bold;
	color:#fff;
}


.closeoverlay a:hover {
	color:#eee;
	text-decoration:underline;
}

video {
  max-width: 100%;
  width: 100%;
  height: auto;
}

.trailerplayer {
	margin:0 auto;
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
	height: 0;
	overflow: hidden;
	text-align:center;
}

.trailerplayer iframe,
.trailerplayer object,
.trailerplayer embed {
	text-align:center;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	margin:0;
	background:none;
	border:none;
}

.vimeo-wrapper {
   position:absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: -1;
   pointer-events: none;
   overflow: hidden;
}

.vimeo-wrapper iframe {
   width: 100vw;
   height: 56.25vw; /* Given a 16:9 aspect ratio, 9/16*100 = 56.25 */
   min-height: 100vh;
   min-width: 177.77vh; /* Given a 16:9 aspect ratio, 16/9*100 = 177.77 */
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   border:0;
}

.liquid-slider {
	background:#eee;
}


.sp1x {
	display:inline-block;
	width:3em;
}

.colct2 {
	column-count:2;
}

/* for MailChimp */

div.mce_inline_error {
	display:inline-block !important;

	font-size:.8em;
}

.field-shift {
    left: -9999px;
    position: absolute;
}

/* Mobile Layout: 480px and below. */


body {
	background-color:#000;
	font-family: opensans, sans-serif;
	font-size: calc(16px + (24 - 16) * ((100vw - 400px) / (2000 - 400)));
	color:#fff;
}

.tpl_wbg {
	background-color:#f5f5f2;
	color:#000;
}

.tpl_wbg a {
	color:#000;
	text-decoration:underline;
}

.tpl_wbg a:hover {
	color:#000;
	text-decoration:underline;
}

.tpl_wbg a:visited {
	color:#000;
}

.tpl_bbg {
	background-color:#000;
	color:#fff;
}

.style01 {
	font-style:italic;
	font-size:1.2em;
}

.home {
	background:url(../img/bg_about.jpg);
	background-repeat:no-repeat;
/*	background-attachment:fixed;*/
	background-position:top;
	background-size:cover;
}

.contact {
	background:url(../img/bg_contact.jpg);
	background-repeat:no-repeat;
	background-attachment:fixed;
	background-position:center;
	background-size:cover;
}

.about {

}

.team {
}


.press {
	background:url(../img/bg_press3.jpg);
	background-repeat:no-repeat;
	background-attachment:fixed;
	background-position:right;
	background-size:cover;
}

.donate {
	background:url(../img/bg_donate2.jpg);
	background-repeat:no-repeat;
	background-attachment:fixed;
	background-position:left;
	background-size:cover;
}

.poems p {
	margin:.2em 0;
}

.gridContainer {
}

.break-mob {
	display:inline;
}

#LayoutDiv1 {
	position:relative;
	height:100vh;
	width:100vw;
	margin:0;
	font-size:1em;
	padding:1em 5%;
}

.showdt {
	display:none;
}


/* forms, buttons */

input:focus {

}

.formcell, .formarea {
	display:block;
	width:100%;
	height:auto;
	border:none;
	padding:.4em;
	margin:0 0 1.2em 0;
	background:#ddd;
}

.formbutton {
	display:block;
	width:auto;
	border:3px solid #fff;
	border-radius:4px;
	padding:.8em 1em;
	background:none;
	color:#fff;
	font-size:1.1em;
	letter-spacing:.1em;
}

.flink {
	display:inline-block;
	text-decoration: none;
	padding:.7em .9em;
}

.formbutton:hover {
	background:#a8a18c;
	color:#fff;
	text-decoration:none;
}

::placeholder { 
	font-family: opensans, sans-serif;
	font-size:1em;
	color:#000 !important;
	opacity:1 !important;
	filter:alpha(opacity=99.99) !important;
}

/* lists */

.list1 {
	margin:.4em 0;
	padding:0;
	text-align:center;
}

.list1 li {
	display:block;
	margin:.4em 0;
	padding:0;
}


/* header */

header {
	position:relative;
	width:100%;
	padding:0;
}

.mainlogo {
	display:block;
	float:left;
	width:75%;
	margin:0 3% 0 0;
	color:#fff;
	font-family:vtypew;
	font-size:.9em;
	line-height:1.4em;
}

.mainlogo a:hover {
	text-decoration: none;
}

.tpl_wbg .mainlogo a {
	color:#000;
}

.mainlogo span {
	font-size:1.7em;
}

.mainlogo a {
	text-decoration: none;
}

/* nav */

nav {

}

#showmenu {
/*	position:fixed;
	top:1em;
	right:5%;*/
	float:right;
	width:10%;
	height:auto;
	margin:0;
	z-index:800000;
}

#showmenu img {
	width:100%;
}

#menu_main {
	position:absolute;
	top:100%;
	left:0;
	width:100%;
	padding:1em 0;
	background:rgba(255,255,255,0.92);
	z-index:2000;
	text-align:center;
	font-size:1.4em;

}

#menu_main ul li {
	position:relative;
	margin:1em 0;
	cursor:pointer;
	color:#000;
}

#menu_main ul li a {
	color:#000;
	text-decoration: none;
}

/* main */

main {
	padding:1em 0;
	margin:5% auto;
	min-height:75vh;
	line-height:1.6em;
}

.homelogline {
	display:none;
	width:100%;
	padding:0 0 2.6em 0;
	text-align:center;
	font-weight:normal;
	font-size:1.8em;
	text-shadow: 0px 0px 4px #000, 0px 0px 4px #000;
	font-style:italic;
}

.home .homelogline {
	display:block;
}


.phcr {
	position:absolute;
	bottom:.2%;
	left:2%;
	padding:0;
	text-align:right;
	font-weight:normal;
	font-size:.8em;
	text-shadow: 0px 0px 4px #000, 0px 0px 4px #000;
}

/*.homelogline1 {
	position:absolute;
	top:55%;
	left:0;
	width:50%;
	padding:0 15% 0 0;
	text-align:right;
	font-weight:normal;
	font-size:1.8em;
	font-style:italic;
	text-shadow: 0px 0px 5px #222;
}

.homelogline2 {
	position:absolute;
	top:55%;
	right:0;
	width:50%;
	padding:0 0 0 15%;
	text-align:left;
	font-weight:normal;
	font-size:1.8em;
	font-style:italic;
	text-shadow: 0px 0px 5px #222;
}
*/

.homesyn {
	position:absolute;
	top:100%;
	left:0;
	width:100%;
	padding:1em 2em;
	background:#f5f5f2;
	text-align:center;
	font-weight:normal;
	font-size:1.2em;
	color:#000;
}

.bff_logo {

	width:60%;
}

.about .formbutton {
	font-size:.9em;
	display:inline-block;
	color:#000 !important;
	border-color:#000;
	text-decoration:none;
}


.donate main {
	padding:10em 0 0 0;
	font-size:1.1em;
}

.merch main {
	font-size:1.2em;
}

.merch main h2 {
	font-size:1.2em;
}

.merch main h3 {
	font-size:1.1em;
}


.donate main .formbutton {
	display:inline-block;
	margin:.6em 0 0 0;
	padding:.4em .6em;
	border:2px solid #fff;
	letter-spacing:normal;
	font-size:1em;
}


.donate main .formbutton:hover {
	background:#444;
}

.donate main a {
	text-decoration: none;
}

.col0 {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.col0x {
	width: 100%;
	margin: 0 0 2em 0;
}


.col01 {
	float:left;
	width:20%;
	margin:0 5% 0 0;
}

.col01 img {
	width:100%;
}

.col01b {
	float:left;
	width:20%;
	margin:0 5% 0 0;
}

.col01b img {
	width:100%;
}

.col02 {
	float:left;
	width:75%;
	margin:0;
}

.col02 h3 {
	margin:0 0 1em 0;
}

.col03 {
	float:left;
	width:60%;
	margin:0;
}

.col03 h3 {
	margin:0 0 1em 0;
	font-style: italic;
}

.col03 h3 b {
	font-weight: normal;
	font-style: normal;
}

.qt {
	width:80%;
	margin:0 auto;
	font-style:italic;
}

.qt::before, .qt::after {
	content:"\"";
}

.qt {
	width:80%;
	margin:0 auto;
}

.qta::before {
	content:"- ";
}

.donorlogo {
	margin:1em 0 1.3em 0;
/*	width:80%;
	margin:1em 10%;
*/}

/* gallery */

.galthumb {
	display:block;
	float:left;
	width:32%;
	margin:0 2% calc(80vw * .02) 0;
}


.galthumb:nth-child(3n+0) {
	margin:0 0 calc(80vw * .02) 0;
}


.galthumb img {
	width:100%;
}


/* footer */

.home .wfooter {
	margin:4em 0 0 0;

}

footer {
	position:relative;
	text-align: center;
	padding:1em 0 2.2em 0;
	z-index:1112;
	font-size:.8em;
}

.home footer {
	display: block;
	width:90%;
	padding:0 0 1em 0;
	position:absolute;
	bottom:2.5%;
}

.team footer, .wfooter {
}

.calhum_logo {
	display: none;
}

.about .calhum_logo {
	display: block;
	float:right;
	width: 40%;
	margin: -9vh 0 0 0;
}

/*.about .footericons,*/ .donate .footericons {
	display:none;
}

.footericons {
	margin:0 0 1.3em 0;
}

.footericons img {
	width:2em;
	margin:0 .6em;
	filter: brightness(2);
}

.home .footericons img {
	display:none;
}


.tpl_wbg .footericons img {	
	filter: brightness(1);
}

.footerbutton {
	font-size:1.25em;
	display:inline-block;
	margin:0 .8em 0 .8em;
	padding:.4em .8em;
	border-radius:4px;
	background:#fff;
	color:#000;
	text-decoration:none;
}

.footerbutton:hover {
	text-decoration: none;
	background:#444;
	color:#fff !important;
}


.home .footerbutton {
	font-size:1em;
}

.home .footerbutton:hover {
	background:#444;
}


.footerbutton:visited {
	color:#000;
}

.tpl_wbg .footerbutton {
	background:none;
	border:2px solid #000;
	text-decoration: none;
}

.tpl_wbg .footerbutton:hover {
	color:#000 !important;
	background:#ccc;
	text-decoration: none;
}

.part_thank {
	text-align:center;
	font-size:1.5em;
	font-style:italic;
}


/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

@media only screen and (min-width: 481px) {

.gridContainer {
}

#LayoutDiv1 {
}

}

/* Desktop Layout: 769px and up.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 769px) {
	
body {
	font-size: calc(7px + .12vw + .12vh + .6vmin)
}

.videooverlay {
	display:block;
	position:absolute;
	top:10%;
	bottom:auto;
	right:auto;
	left:20%;
	width:60%;
	padding:2em 0 0 0;
	margin:0;
	text-align:right;
}

.gridContainer {
	position:relative;
	padding:0;
	margin:0 auto;
	width:100%;
}

#LayoutDiv1 {
	position:relative;
	width:100%;
	margin:0;
	padding:2% 5%;
	font-size:1;
}

.showmob {
	display:none;
}

.break-mob, .showdt {
	display:inline;
}

.break-mob-b, .showdt-b {
	display:block;
}

.colct2 {
	column-count:2;
}

/* header */

.mainlogo {
	display:block;
	float:left;
	width:40%;
	margin:0 0 0 0;
	color:#fff;
	font-family:vtypew;
	font-size:1.6em;
	line-height:1.4em;
}

.mainlogo span {
	font-size:1.7em;
}


/* nav */

#showmenu {
	display:none;
}

#menu_main {
	display:block;
	position:relative;
	float:left;
	width:60%;
	background:none;
	font-size:1.2em;
}

#menu_main ul {
	margin:0;
	padding:0;
	text-align:right;
}

#menu_main ul li {
	display:inline-block;
	margin:0 0 0 1.6em;
	color:#fff;
}

#menu_main ul li:first-child {
	margin:0;
}

#menu_main ul li a {
	color:#fff;
	text-decoration: none;
}

#menu_main ul li a:hover {
	border-bottom:3px solid #fff;
}

.about #menu_main ul li a:hover {
	border-bottom:3px solid #000;
}

.tpl_wbg #menu_main ul li a {
	color:#000;
}

.tpl_wbg #menu_main ul li {
	color:#000;
}


.tpl_wbg #menu_main ul li a:hover {
	border-bottom:3px solid #000;
}

.menu_donate a {
	padding:.3em .6em;
	background:#fff !important;
	color:#000 !important;
	border-radius:4px;
}

.menu_donate a:hover {
	border:none !important;
	background:#444 !important;
	color:#fff !important;
}

.tpl_wbg .menu_donate a:hover {
	padding:.3em .6em;
	background:#ccc !important;
	color:#000 !important;
}

.tpl_wbg .menu_donate a {
	border:none !important;
	background:#444 !important;
	color:#fff !important;
}

.menu_sub {
	display:none;
	position:absolute;
	top:100%;
	left:0;
	width:8em;
	padding:.2em 0 0 0 !important;
	text-align: left !important;
}

.menu_sub li {
	display:block !important;
	margin:0 !important;
	padding:.4em 0 .2em 0 !important;
	text-align: left;
}

.menu_donate .menu_sub li a {
	background: none !important;
	margin:.3em .6em;
	padding: 0;
	color: #fff !important;
	border-radius:0;
}

.menu_donate .menu_sub li a:hover {
	background: none;
	border-bottom:3px solid #fff !important;
}

.tpl_wbg .menu_donate .menu_sub li a {
	background: none !important;
	margin:.3em .6em;
	padding: 0;
	color: #000 !important;
	border-radius:0;
}

.tpl_wbg .menu_donate .menu_sub li a:hover {
	background: none;
	border-bottom:3px solid #000 !important;
}

#menu_main ul li:hover .menu_sub {
	display: block;
}

footer {
	font-size:1em;
}

/* main */

main {
	min-height:60vh;
	margin:5% auto 2% auto;
	padding:0;
}


.home footer {
	bottom:0;
}

.homelogline {
	margin:0 0 3.4em 0;
	padding:0;
	font-size:2em;
}

.phcr {
	position:absolute;
	bottom:1.5%;
	left:2%;
	padding:0;
	text-align:right;
	font-weight:normal;
	font-size:1em;
	text-shadow: 0px 0px 4px #000, 0px 0px 4px #000;
}

.homesyn {
	padding:2em 4em;
	font-size:1.4em;
}

.bff_logo {
	width:30%;
}

.about {
	background:url(../img/bg_about3.jpg);
	background-repeat:no-repeat;
	background-attachment:fixed;
	background-position:top;
	background-size:cover;
}

.about .mainlogo a {
	color:#fff;
}

.about main {
	margin:0 0 5% 47%;
	width:53%;
	font-size:1.2em;
	color:#000;
	text-align: justify;
}

.about main p {
	margin:0 0 2em 0 !important;
}

.about main h3 {

}

.about .formbutton:hover {
	background:#ddd;
	text-decoration:none;
}

.about footer {
	margin:0 0 0 47%;
	padding:0;
	text-align: left;
}

.watch main {
	width:70%;
	margin:5% auto;
}

.contact main {
	width:45%;
	margin:5% 10% 5% 45%;
}

.contact h3 {
	font-size:1.4em;
}

.team main {
	width:75%;
	font-size:1.2em;
	text-align: justify;
}

.press {
	background-position:center;
}

.press main {
	width:50%;
	font-size:1.2em;
	line-height:1.6em;
}

.events main {
	width:50%;
	font-size:1.2em;
	line-height:1.6em;
}

.events main a, .press main a {
	text-decoration: none;
}

.events main a:hover, .press main a:hover {
	text-decoration: underline;
}

.donate {
	background-position:top;
}

.donate main {
	width:56%;
	margin:0 0 3% 34%;
	font-size:1.35em;
	padding:3% 0 0 0;
	color:#fff;
	text-align: left;
}

.donate main p {
	margin:0 0 1em 0;
	
}

.donorlogo {
	/*width:auto !important;*/
	margin:1em 0 1.3em 0;
}

.poems main {
	width:70%;
	margin:5% 0 0 33%;
	font-size:1.2em;
}

.poems main h3 {
	margin:0 0 .2em 0;
}

.poems main h4 {
	font-weight:normal;
	font-size:1em;
	margin:0 0 1em 0;
}

/* partners */

.partners main {
	margin:5% auto;
}

.partnerlist a {

}

.partnerlist img {
	display:inline-block;
	width:22%;
	margin:0 calc(8%/3) 2.6em 0;
}

.partnerlist img:nth-child(4n+0) {
	margin-right:0;
}

.about .footericons img {
	margin:0 1.6em 0 0 !important;
}

.footerbutton {
	margin:0 .8em .8em .8em;
}

.about .footerbutton {
	background:none;
	margin:0 1.6em .6em 0 !important;
	border:2px solid #000;
	letter-spacing:normal;
	text-decoration: none;
	padding:.5em .8em;
}

.about .footerbutton:hover {
	background:#ddd;
	color:#000 !important;
	text-decoration: none;
}

}

@media only screen and (min-width: 1300px) {

#LayoutDiv1 {
	position:relative;
	width:100%;
	margin:0;
	padding:2% 6.5% 2% 6.5%;
}

.mainlogo {
	font-size:1.8em;
}

.col0x {
	width: 70%;
	margin: 0 auto 3em auto;
}

}

@media only screen and (min-width: 1500px) {

#LayoutDiv1 {
	position:relative;
	width:100%;
	margin:0;
	padding:2% 8% 2% 8%;
}

.mainlogo {
	font-size:2em;
}

}

@media only screen and (min-width: 1700px) {

#LayoutDiv1 {
	position:relative;
	width:100%;
	margin:0;
	padding:2% 8% 2% 8%;
}

.mainlogo {
	font-size:2em;
}

}


@media (min-aspect-ratio: 2/1) {
	

}

@media (max-aspect-ratio: 14/10) {


}