/*
Theme name: Maya Shop Child
Description: The start base for easy theme wordpress development.
Author: Your Inspiration Web
Author URI: http://www.yourinspirationweb.com/en/
License: GNU General Public License version 3.0
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Tags: black, red, white, light, one-column, two-columns, left-sidebar, right-sidebar, fixed-width, custom-colors, custom-header, custom-background, custom-menu, editor-style, theme-options, threaded-comments, sticky-post, translation-ready
template: maya
*/

@import url("../maya/style.css");


/* Homepage: Main content area background */
body.page-id-20002141 #primary{
background:#333333;}
 

/* Below you can write your style */
#nav > ul li a, #nav .menu > ul li a { border-left: 0px; }
#nav { margin-top: 0px; border: 0px; }



hr {
    margin: 0;
width: 100%;
    margin-top:15px;
    margin-bottom:15px;
}

.boxed-layout .wrapper {background: #eeeeee;}

h1, h2, h3, h4, h5, h6, dl, ul, ol { margin:0em 0 0.0em; }
p {
margin: 0 auto 1em;
} 
h1 { line-height:normal; }
h2 { line-height:normal; }
h3 { line-height:normal;letter-spacing:0px}
h4 { line-height:normal;letter-spacing:0px }
h5 { line-height:normal; }
h6 { line-height:normal}  
.hentry .wp-post-image {border-radius:0px;-moz-border-radius:0px;-webkit-border-radius:0px;}
.hentry .thumbnail .date {position:absolute;bottom:0;left:0;width:82px;height:91px;background:url('images/date-bg.png') no-repeat;margin:0;}
.blog-big .without.thumbnail {display:none;} 
.boxed-layout .bg-shadow { max-width:1023px; width:auto; margin:0 auto; background:none; }
#copyright .newsletter-section form input[type="text"]{width:300px;}
#logo { text-align: left;padding-left: 0px; padding-top: 0px; margin-left: -20px; }
.blog-big .thumbnail h1, .blog-big .thumbnail h2 {border-left-radius:0px;-moz-border-radius-topleft:0px;-webkit-border-top-left-radius:0px;} 
#content ul { margin-left:20px; margin-top:-10px; margin-bottom:15px; list-style:square }
#aboutuslinks { 
float:left;
width:96%;
font-family:helvetica, geneva, serif;
font-size:1.2em;
border:1px solid #CBCBCB;
color: #444444;
}
#lineborder {
	width:auto;
	height:7px;
	background-image: url("https://sfcinematheque.org/wp-content/uploads/2013/01/diagonal-line5.png");background-repeat: repeat;
}

#lineborder2 {
	width:auto;
	height:7px;
	margin-left:368px;
	margin-right:15px;
	margin-top:10px;
	margin-bottom:10px;
	background-image: url("https://sfcinematheque.org/wp-content/uploads/2013/01/diagonal-line5.png");background-repeat: repeat;

}

div.hr {
  height: 7px;
  margin-top: 7px;
  margin-bottom:7px;
  background: url("https://sfcinematheque.org/wp-content/uploads/2013/01/diagonal-line5.png");background-repeat: repeat;
}
div.hr hr {
  display: none;
}
/* searchform */
#header #searchform {margin: 0; position:absolute; right:-15px; bottom:180px;background-color:#333; }


/* ====================== START SEARCHBOX ====================== */
#searchform { margin:10px 0 30px 0 }
#searchform .screen-reader-text { display:none }
#searchform input {border-left:none;border-top:none;border-right:none;border-bottom:2px solid #ffffff;color:#ccc;}
input#searchsubmit {cursor:pointer;width:75px;padding:4px;}
input#s { width:118px; padding:5px;background-color:#333; }
/* ====================== END SEARCHBOX ====================== */    


/* FEATURED PRODUCT WIDGET */
ul.products.ribbon li span.price, ul.products.traditions li span.price, .product_list_widget span.amount { display: none; }


/* widget_nav_menu */
.widget_nav_menu div { border-left: 1px; padding-left: 20px; }
.widget_nav_menu a {
    padding-left:30px;
	font-size:125%
}
.widget_nav_menu h3 {
    padding-left:10px;
	font-size:80%;
}
.widget_nav_menu li:hover {
    background-image: url("https://sfcinematheque.org/wp-content/uploads/2013/01/diagonal-line1.png");background-repeat: repeat;
}

.widget_nav_menu h3 { font-size: 20px; margin-bottom: 0px; }
#sidebar .widget h2, #sidebar .widget h3 { background-color: #D8D8D8; } 
#sidebar .widget { background-color: #D8D8D8; padding:5px; } 
#sidebar div { border-left:0px; padding-left:0px; } 

/* LATEST TWEETS WIDGET */
#sidebar div .dw-twitter-inner { border-left: 0px; padding-left: 7px; padding-right:5px; }



/* Screening list */
#feature {

padding-top: 2px;
padding-bottom: 0px;
padding-left: 5px;
padding-right: 8px;
height:auto;
min-height:130px;
height:auto !important;
display:block;          
}
#feature .ridge {
  border-style: solid;
  border-width:2px;
  border-color:#e6b010;
  margin-top:5px;
  display:inline-block;
  float:left;
  
  }
  
  /* Upcoming screenings sidebar widget */
  #featuresml {

padding-top: 0px;
padding-bottom: 0px;
padding-left: 20px;
padding-right: 7px;
height:auto;
height:auto !important;
display:block; 
line-height:20%; 
margin-left:5px;       
}


#featuresml .ridge {
  max-height:160px;
  border-style: none;
  border-width:0px;
  margin-top:0px;
  display:inline-block;
  float:left;
  
  }

#feature:hover {
background-image: url("https://sfcinematheque.org/wp-content/uploads/2013/01/diagonal-line1.png");background-repeat: repeat;
}

/* Single Screening page */
#wrapperscreeninginfo {position:relative;	
clear:both;}
#imagecontainer {
	position:absolute;
	top:0px;
	left:0px;
	width: 315px;
	height: 233px;
	border-style: solid;
	border-width: 2px;
	border-color:#e6b010;
	display: inline-block; overflow: hidden;
	float:left;
	margin-right:20px;
}

#imagecontainer .imgcrop {
	  margin-top:-5px;
	  height:auto;
	  width:auto;
	  min-height:238px;
	  min-width:320px;
	  }
	  
#screeninginfo {
	position:absolute; 
	top:0px;
	left:340px;
	
}

#wrapperscreeninginfo .imgcaption {
	position:absolute;
	top:117px;
	left:0px;
	width:319px;
	height:auto;
	background-color:#e6b010;
	text-align:center;
	display:block;
	margin-bottom:20px;

	
}
.descspace {
margin-top:250px;

}

.descspacehm {
margin-top:500px;

}
/* News list page */
#featurenews {

padding-top: 15px;
padding-bottom:-5px;
padding-left: 5px;
padding-right: 8px;
height:auto;
min-height:136px;
height:auto !important;
display:block;          
}


#featurenews:hover {
background-image: url("https://sfcinematheque.org/wp-content/uploads/2013/01/diagonal-line1.png");background-repeat: repeat;
}

.ridgenews {
  border-style: solid;
  border-width:2px;
  border-color:#e6b010;
  margin-top:5px;
  margin-right:15px;
  display:inline-block;
  float:left;
  
  }	
  
  .singlenews {
  border-style: solid;
  border-width:2px;
  border-color:#e6b010;
  display:inline-block;
  float:left;
  
  }	
  
  /* Home page features */
#homepgfeature {position:relative;
width:0px;
height:auto;
background-color:#F00;

}
#hmpgftrimagecontainer {
	position:relative;
	top:-15px;
	left:-20px;
	width: 1000px;
	height: 350px;
	border-style: solid;
	border-width: 1px;
	border-color:#ffffff;
	display: inline-block; overflow: hidden;
	float:left;
	margin-right:20px;
	
	
}

#hmpgftrimagecontainer .imgcrop {
	  margin-top:-70px;
	  height:auto;
	  width:auto;
	  min-width:1000px;
	  min-height:357px;
	    
	  }
	  
#hmpgftrscreeninginfo {
	float:left; 
	margin-left: -20px;
	margin-top: -15px;
	width:635px;
	height:67px;
	padding:20px;
	background-color:#FAFAFA;
	text-align:left;
	border-top:solid;
	border-width:1px;
	border-color:#FFF;
	
}

  
#hmpgftrdate {
	position:absolute; 
	top:336px;
	left:655px;
	width:307px;
	height:82px;
	padding-left:20px;
	padding-top:27px;
	background-color:#A4A4A4;
	text-align:left;

	
	
	
}

#homepgfeature .imgcaption {
	position:absolute;
	top:315px;
	left:-20px;
	width:481px;
	height:auto;
	padding-left:20px;
	text-align:left;
	text-shadow: 1px -1px 2px #2E2E2E;
	display:block;
	vertical-align:bottom;
	


	
}
  /* Home page feature -- FEATURED FILMMAKER */

#homepgfeature2 {
float:left;
clear:none;
margin-left: -20px;
margin-top: 10px;
width:470px;
height:auto;
background-image: url("https://sfcinematheque.org/wp-content/uploads/2013/01/diagonal-line1.png");background-repeat: repeat;
}

#homepgftr2imagecontainer {
	position:absolute;
	left:200px;
	width: 270px;
	height: 190px;
	border-style: solid;
	border-width: 1px;
	border-color:#ffffff;
	display: block; overflow: hidden;
	float:left;
	margin-right:20px;

}

#homepgftr2imagecontainer .imgcrop {
	  margin-top:-0px;
	  margin-left:-10px;
	  height:auto;
	  width:auto;
	  min-width:280px;
	  min-height:190px;
	    
	  }


#homepgfeature2 .imgcaption {
	float: left;
	top:0px;
	left:0px;
	width:205px;
	height:47px;
	padding-top:20px;
	padding-bottom:15px;
	padding-left:15px;
	background-color:#CCC;
	opacity:0.4;
	text-align:left;
	display:block;
	margin-bottom:0px;
	clear:left;
	background-image: url("https://sfcinematheque.org/wp-content/uploads/2013/01/diagonal-line1.png");background-repeat: repeat;

	
}

#homepgfeature2 .infobox {
	float:left;
	left:0px;
	width:180px;
	height:99px;
	padding-left:20px;
	padding-top:10px;
	padding-right:20px;
	background-color:#FAFAFA;
	
	text-align:left;
	border-top:solid;
	border-width:0.5px;
	border-color:#FFF;
	clear:left;
}

.infobox p {line-height:19px;}
  /* Home page feature -- LATEST NEWS BOX */
  
#homepgfeature3 {
position:absolute;
top:435px;
left:485px;
margin-right:-20px;
margin-top: 20px;
width:480px;
height:190px;
background-image: url("https://sfcinematheque.org/wp-content/uploads/2013/01/diagonal-line1.png");background-repeat: repeat;
}

#homepgftr3imagecontainer {
	position:relative;
	left:225px;
	top:-82px;
	width: 270px;
	height: 190px;
	border-style: solid;
	border-width: 1px;
	border-color:#ffffff;
	display: block; overflow: hidden;
	margin-right:20px;

}

#homepgftr3imagecontainer .imgcrop {
	  margin-top:-0px;
	  margin-left:-10px;
	  height:auto;
	  width:auto;
	  min-width:280px;
	  min-height:190px;
	    
	  }


#homepgfeature3 .imgcaption {
	position:relative;
	top:0px;
	left:0px;
	width:210px;
	height:47px;
	padding-top:20px;
	padding-bottom:15px;
	padding-left:15px;
	background-color:#CCC;
	opacity:0.4;
	text-align:left;
	display:block;
	margin-bottom:0px;
	background-image: url("https://sfcinematheque.org/wp-content/uploads/2013/01/diagonal-line1.png");background-repeat: repeat;

	
}

#homepgfeature3 .infobox {
	position:relative;
	top:-194px;
	left:0px;
	width:185px;
	height:101px;
	padding-left:20px;
	padding-top:10px;
	padding-right:20px;
	background-color:#FAFAFA;
	
	text-align:left;
	border-top:solid;
	border-width:1px;
	border-color:#FFF;
	clear:both;
	line-height:80%;



	
}

#homepagecontainer {position:absolute;
width:1025px;
top:-30px;
left:-30px;
background-color:#F00;}
#homepagecontainer2 {position:absolute}




/* Shop */
#shoplist {
padding-top: 2px;
padding-bottom: 0px;
padding-left: 5px;
padding-right: 8px;
height:auto;
width:auto;
display:block;          
}

#shoplist .ridge {
  border-style: solid;
  border-width:1px;
  padding:5px;
  border-color:#e6b010;
  margin-top:5px;
  display:inline-block;
  float:left;
  
  }
  
form.woocommerce_ordering select{display:none;}

/* Video Program Single Styles */

#video-program-wrapper #video-content {
	padding: 20px 20px 0 20px;
	text-align: justify;
}

#video-program-wrapper #video-content p {
	font-family: Arial, Helvetica, sans-serif !important;
	font-size: 14px;
	line-height: 1.81em;
	color: #4a4a4a;
}

.video-program, .video-program-additional-info {
	text-align: left;
	padding: 0 15px 0 15px;
}

.video-program .video-wrapper {
  	clear: both;
}

.video-program .video {
	width: 42%;
	display: inline-block;
	float: left;
	padding-right: 10px;
}

.video-program .video .video-embed {
	padding: 56.25% 0 0 0;
	position: relative;
	margin-bottom: 20px;
	background-color: #000000;
}

.video-program .video .video-embed > iframe {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

.video-program .video img.video-still {
	max-width: 100%;
}


/* Video program descriptions collasping feature */
.wrap-collabsible {
  /*margin-bottom: 1.2rem 0;*/
  margin: 1.2rem 0;
}

.video-description-container input[type='checkbox'] {
  display: none;
}

/*The title*/
.lbl-toggle {
  display: block;
  font-weight: bold;
  font-size: 1.2rem;
  text-align: left;
  padding: 1rem;
/*  background: : rgb(238,238,238);
*/  color: rgba(168,38,43);
  background:#fff;
  cursor: pointer;
  border-radius: 7px;
  transition: all 0.25s ease-out;
  font-family: 'Montserrat', sans-serif !important;
}

.lbl-toggle:hover {
  color: red;
}

.lbl-toggle::before {
  content: ' ';
  display: inline-block;

  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 5px solid currentColor;
  vertical-align: middle;
  margin-right: .7rem;
  transform: translateY(-2px);

  transition: transform .2s ease-out;
}

.toggle:checked + .lbl-toggle::before {
  transform: rotate(90deg) translateX(-3px);
}

.collapsible-content {
  max-height: 0px;
  overflow: hidden;
  transition: max-height .25s ease-in-out;
}

.toggle:checked + .lbl-toggle + .collapsible-content {
  max-height: 100vh;
}

.toggle:checked + .lbl-toggle {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.collapsible-content .content-inner {
  background: #fff;
  color: #000;
  border-top: 1px solid red  color: ;
  border-bottom-left-radius: 7px;
  border-bottom-right-radius: 7px;
  padding: .5rem 1rem;
}

.collapsible-content .content-inner p {
	font-size: 14px;
}

/* Video Program Archive Styles */

.archive-content {
	padding: 20px 20px 0 20px;
	text-align: justify;
}

/* Festival Page */

.page-template-page-festival-programs .page, .additional_info {
	margin: 50px 25px;
}

/* Mobile first grid */
.program-grid-wrapper {
  display: grid;
  grid-template-columns: 1fr;
  grid-auto-rows: 1fr;
  align-items: center;
  background-color: black;
}

.program-block {
	/*display: flex;	*/
	justify-content: center;
	position: relative;
}

.program-block img, .odd-program img {
	display: block;
	max-width: 500px;
	height: auto;
}

.program-block .title, .odd-program .title {
	position: absolute;
	top: 35%;
	text-align: center;
	padding: 0;
	width: 100%;
}

/*Since client requested a WYSYWG editor for this title, but ACF wraps a <p> tag around the content within the h1*/
.title h1 > * {
	color: inherit !important;
	font-size: inherit !important;
}

/* Yes, 1023...the dimensions in parent theme */
@media all and (min-width: 1023px) { 
    .program-grid-wrapper {
      /*3 column grid*/
	  grid-template-columns: 1fr 1fr 1fr;
	}
	.program-block img {
		width: 100%;
		max-width: 100%;
	}
	.odd-program img {
		max-width: 50%;
	}

	.title {
		padding: 10px;
		text-align: center;
		max-width: 500px;
	}

	.odd-program .title {
		max-width: 300px;
	}
}


/* Full Width Page Template */
.full-width figure {
	margin-left: 0;
	margin-right: 0;
}

/*Full Width Dark Mode Page Template*/

body.page-template-page-full-width-dark {
	background: #000;
}

body.page-template-page-full-width-dark #header, 
body.page-template-page-full-width-dark #nav,
body.page-template-page-full-width-dark #nav .sub-menu,
body.page-template-page-full-width-dark #primary {
	background-color: #000;
}

body.page-template-page-full-width-dark #primary,
body.page-template-page-full-width-dark #primary h3,
body.page-template-page-full-width-dark #primary a {
	color: #fff;
}

/*Full Width Vimeo Embeds (for Livestream Page)*/

.embed-container {
  --video--width: 1296;
  --video--height: 540;

  position: relative;
  padding-bottom: calc(var(--video--height) / var(--video--width) * 100%); /* 41.66666667% */
  overflow: hidden;
  max-width: 100%;
  background: black;
}

.embed-container iframe,
.embed-container object,
.embed-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

