/* reset browser styles  last revised jan 1`, 2025*/
			
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1.2;
}
ol {
	padding-left: 1.4em;
	list-style: decimal;
}
ul {
	padding-left: 1.4em;
	list-style: square;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
			/* end reset browser styles */


#background {
     		border: 1px solid gray;
		  max-width: 89%; /*850px;*/
		  max-width: 1250px;
		  margin: 3% 7% 5% 10%;
		  padding: 30px;
		  background: rgba(255,255,255,0.94); /* opacity is 0.94 */
		  -moz-border-radius: 30px; /* added to round corners no ie? */
		  -webkit-border-radius: 30px;
	   	 border-radius: 30px;
		   }
		 
	body {
    	background: url(../images/theater_background.jpg) no-repeat 50% center fixed; /*new image feb 28, 2015*/
   	 -webkit-background-size: cover;
   	 -moz-background-size: cover;
   	 -o-background-size: cover;
    	background-size: cover;
	    color: black;
  	  font-family: Tahoma, sans serif;
  	  margin: 0;
	   }

/* Generated by Font Squirrel (http://www.fontsquirrel.com) on January 26, 2014 */

	@font-face {
    font-family: 'grand_hotelregular';
    src: url('../fonts/grandhotel-regular-webfont.eot');
    src: url('../fonts/grandhotel-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/grandhotel-regular-webfont.woff') format('woff'),
         url('../fonts/grandhotel-regular-webfont.ttf') format('truetype'),
         url('../fonts/grandhotel-regular-webfont.svg#grand_hotelregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
		
	#gh1 {
 	font-size: 400%;
 	color: #660000;
 	line-height: 80%;
 	margin-left: 180px;
 	margin-top: -5px;
 	margin-bottom: -15px;
 	letter-spacing: 60%;
	font-family: grand_hotelregular, Georgia, serif;
	 }
 		
 	#gh2 {
 	font-size: 150%;
 	color: #660000;
 	margin-left: 300px;
 	margin-bottom: 20px;
 	font-family: grand_hotelregular, Georgia, serif;
	 }
	
	#banner {
	margin-top: 0px;
	/*border-bottom: 1px solid #627081;/*#73AFB7*/
	padding-left: 15px;
	}

	  
	#banner h1{
  	float: center;
  	font-family: Helvetica, Arial, sans-serif;
	font-size: 190%;
	font-type: bold;
  	margin-top: 3px;
	margin-bottom: 10px;
	color: #450f1c;
		}
		
	#banner h2{
	float: center;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 100%;
	padding-left: 4px;
	margin-left: 170px;
	margin-bottom: 8px;
	color: #450f1c;
	}
	
	#banner a  {
    	font-size: 1.0em;
	color:#14556B;
    	display: block;
	text-align: left;
	padding: 0;
	text-decoration: none;
	}
	
	#banner p {
    	line-height: 1.4em;
	}
	
	#banner img {
	  
	  margin-left: -3%;
	}


	#nowshowing h5 {
	margin: 0;
 	float: right;
	}
 
	/*#banner img */
	img.logofaces {
 	 position: absolute;
	 top: 10%; left: 13%;
   	margin: 5px 20px 2px 5px;
	 padding: 30px;
   	border-width: 0;
	 display: block;
 	}
 

	#content {
  	padding-left: 10px;
  	float:clear;
	}
	
	#content img {
   	margin: 10px;
	  border-right: 5px solid gray;
	 border-bottom: 5px solid gray;
	 border-left: 1px solid gray;
	 border-top: 1px solid gray;
	 	}
		
	#nowshowing {
  	padding-left: 1px;
	margin-top: 3px;
  	float:clear;
	 /*border-top: 2px solid black;*/
	}
	
	#nowshowing img {
   	float: right;
   	margin: 15px 15px 0 10px;
	 border-right: 1px solid dimgray;
	border-bottom: 1px solid dimgray;
	-webkit-transition: all 1s; /* the webkit, moz, and o variables are for vairous browers */
 	 -moz-transition: all 1s;
 	 -o-transition: all 1s;
	/*background:  url(../images/photo-frame.gif) no-repeat bottom right;*/
	 	}
		
	#nowshowing img:hover {
	-webkit-transform: scale(1.2) rotate(3deg);
  	-moz-transform: scale(1.2) rotate(3deg);
 	-o-transform: scale(1.2) rotate(3deg);
	-ms-transform: scale(1.2) rotate(3deg);
	}
	
	
	#smallicon img {
   	width: 20.5%;  /* was 100px dec 2017 */
	 float: right;
	 padding: 35px 15px 4px 20px;
	 margin-right: 30px; /*was 50 px */
	 margin-bottom: 20px;
	 margin-left: 15px; /* moves text away */
	 border: 0px;
	 -webkit-transition: all 1s; /* the webkit, moz, and o variables are for various browsers */
 	 -moz-transition: all 1s;
  	-o-transition: all 1s;
	/*background:  url(../images/photo-frame.gif) no-repeat bottom right;*/
	}
		
	#smallicon img:hover {
	border: 0px;
	padding: 30px;
	-webkit-transform: scale(1.6) rotate(3deg);
  	-moz-transform: scale(1.6)rotate(3deg);
  	-o-transform: scale(1.6) rotate(3deg);
	-ms-transform: scale(1.6)rotate(3deg);
	}
	
	#nowshowing a  {
  	padding: 0;
	color: #627081;
	text-decoration: none;
	}
			
	#nowshowing a:hover {
  	 letter-spacing: .112 em;
	  color: #660000;
	 }
	 
		 
	 #nowshowing h3 {
	font-size: 0.8em;
	color: #450f1c;
	padding: 3px;
	margin: -10px 0 4px 25px;
	}
	 
 	#nowshowing h1 {
 	font-family: Helvetica, Arial, sans-serif;
  	padding-top: 1px;
  	margin: -12px 0 4px 175px;
 	font-size: 1.2em;
	color: #450f1c;
	}
	
	.nowshowing h5 {
 	font-family: Helvetica, Arial, sans-serif;
  	font-size: 1.1em;
	color: #450f1c;
	margin-left: 3px;
		}
		
	#nowshowing h6 {
	 margin: 5px 10px 2px 180px;
	 font-family: Helvetica, Arial, sans-serif;
   	font-size: 1.1em;
	 color: #627081;
		}
		
		
	#nowshowing h2, #comingsoon h2 {
	font-size: 1em;
	font-family: Helvetica, Arial, sans-serif;
	color: #627081;
	margin-left: 25px;
	margin-top: 6px;
	
	}		

	#nowshowing small {
	color: black;
	font-variant: small-caps;
	}


	img.noborder {
 	float: left;
   	padding: 4px 4px 14px 15ps;
	 border: 0;
	 }

	#content h1 {
  	padding-top: 10px;
 	 padding-left: 15px;
  	font-size: 1.1em;
	color: black;
	 }
			
h1 {
	font-size: 1.5em;
	color:#14556B;
	}

h2 {
	font-size: 1.1em;
	color: #14556B;
	padding: -5px 0 0 10px;
	margin-top: -10px;
	margin-bottom: 19px;
	position: right;
	}
	
h1.movietitle {
	font-size: 1.2em;
	}
	
h2.movietitle {
	  margin-bottom: 1%;
	  font-size: 1.0em;
	}
	
h3.movietitle {
	font-size: 0.8em;
	color: black;
	padding: 0 0 0 5px;
	margin-top: 5px;
	margin-bottom: 5px;
	position: right;
	}

	
	

#content h2 {
	font-size: 1.1em;
	color: #14556B;
	padding: -5px 0 0 10px;
	margin-top: -10px;
	margin-bottom: 19px;
	position: right;
	}
	
	
h3	 {
	font-size: 0.8em;
	color: black;
	padding: 0 0 0 5px;
	margin-top: 5px;
	margin-bottom: 5px;
	position: right;
	}

#content h3	 {
	font-size: 0.8em;
	color: black;
	padding: 0 0 0 235px;
	margin-top: 5px;
	margin-bottom: 5px;
	}
	
h4 {
	font-size: 0.95em;
	color: #14556B;
	padding: 0 3px 0 3px;
	margin-left: 13px;
	margin-top:3px;
	margin-right: 24px;
	margin-bottom: 1px;
	/*position: right;*/
}


	p {
	font-size: 1.0em;
	margin-top:1 px;
	margin-bottom: 0;
	line-height: 130%;
	letter-spacing: 0.9px;
	}
	
	p.rrated {
	font-size: 0.88em;
	}

	p.byline {
	color: #627081;
	font-size: 0.8em;
	margin-top: -10px;
	margin-bottom: -10px;
	font-weight: bold;
	letter-spacing: 1px;
	font-variant: small-caps;
	text-indent: 0;
}

	p.byline2 {
	color: #627081;
	font-size: 0.8em;
	margin-top: 2px;
	margin-bottom: 2px;
	font-weight: bold;
	letter-spacing: 1px;
	font-variant: small-caps;
	text-indent: 0;
	}
 
	

#mainNav {
	float: left;
	width: 9.5em;
	margin: 3% 2% 2% 2%;
	padding: 1% 1.5% 1.8% 1.5%;
	border: 1px solid black;
	-moz-border-radius: 2%;  /*added to round corners */
	border-radius: 2%;
  	background:  #dbdbf1  url(../images/mainnav.gif) repeat-x top left; /* for old browsers */
	background: -moz-radial-gradient(25% 55%, white,#f7e2de);
	background: -o-radial-gradient(25% 55%, white, #f7e2de);
	background: -webkit-radial-gradient(25% 55%, white, #f7e2de);
  	background: -ms-radial-gradient(25% 55%, white, #f7e2de);
	}
	
#mainNav ul {
	font-size: 0.9em;
	list-style-type: none;
	padding: 6% 2% 0 0;	
	margin-left: 0;	
	text-transform: uppercase;
		/*text-align:center; */
	}
	
#mainNav li {
	margin-bottom: 0.2em;
	line-height: 0.9em;
	}

#mainNav li a {
    		display: block;
		font-size: 0.9em;
		line-height: 1.1em;
		color: #660000;
		text-align: left;
		font-weight: bold;		
		text-decoration: none;
		}		
			
#mainNav  a:visited {
    		display: block;
		color: #660000;
		text-align: left;
		font-weight: normal;
		padding: 0;
		text-decoration: none;
		}

			
#mainNav  a:hover {
		font-size: 0.85em;
   		color: #660000;
		font-weight: normal;
		text-decoration: none;
		}
			
#mainNav li h4 {
    		margin-left: 0;
		}
			
#donor p {	
    		line-height: 100%;
		margin: 0;
		margin-left: 250px;
		padding: 0 0 0 5px;
		}
	
	/* animation of logo */
	
	@-webkit-keyframes 'logo' {
	from {
		left: 120%;
		-webkit-transform: rotate(0) scale(.75);
	}
	50% {
		-webkit-transform: rotate(-720deg) scale(.75);
		left: 0;
	}
	to {
		-webkit-transform: rotate(0) scale(1);
	}
}
@-moz-keyframes logo {
	0% {
		-moz-transform: rotate(0) scale(.75);
	}
	70% {
		-moz-transform: rotate(-720deg) scale(.75);
	}
	100% {
		-moz-transform: rotate(0) scale(1);
	}
}
@-o-keyframes logo {
	from {
		left: 120%;
		-o-transform: rotate(0) scale(.75);
	}
	70% {
		-o-transform: rotate(-720deg) scale(.75);
		left: 0;
	}7/Apr/2017 17:50
	to {
		-o-transform: rotate(0) scale(1);
	}
}

@keyframes logo {
	0% {
		left: 70%;
		transform: rotate(0) scale(.75);
	}
	70% {
		transform: rotate(-720deg) scale(.75);
		left: 0;
	}
	100% {
		transform: rotate(0) scale(1);
	}
}

.logo, .logofaces {
	-webkit-animation: logo 3s  ease-out;
	-moz-animation: logo 3s ease-out;
	-o-animation: logo 3s ease-out;
	animation: logo 3s ease-out;
}
	/* end animation */

	#content ul {
	font-size: 0.8em;
	list-style-type: square;
	}

	#content li {
	margin-bottom: 5px;
	}
	
	/* horizontal rules between movies */
	
	hr.moviebreak {
	display: block;
       	position: relative;
      	 margin: 2% 0 2% 30%;
       	height: 0;
       	width: 30%;
      	 max-height: 0;
       	line-height: 0;
       /*clear: both;  was in the sample I found...? removed later */
      	 border: none;
      	 border-top: 1px solid #aaaaaa;
      	 border-bottom: 1px solid #ffffff;	
	}
	   
	/* <hr> between movies end */

	#comingsoon p  {
	padding: 2px 2 px 2px 0;
	margin: 0;
	}


	#comingsoon h2 {
  	position: left;
	margin:0;
	padding: 2px;
	font-size: 1 em;
	color: #627081;
	}
	
	
	#comingsoon h1 {
 	font-family: Ariel, sans-serif; Georgia;
  	position: left;
	margin:0;
	padding: 0 0 0 -4px;
	/*font-size: 1.2em;*/
	color: #450f1c;
	}
		
	#comingsoon h3 {
   	 margin: 0;
 	 padding: 3px;
  	position: left;
	color: #450f1c;
	}
	
	#comingsoon a  {
    	padding: 0;
	color: #627081;
	text-decoration: none;
	
	}
	
	#comingsoon  h2 a {
	line-height: 0;
	}
			
			

	#comingsoon a:hover {
   	letter-spacing: .01em;
	  color: #660000;
	 }
		 
 
	#comingsoon img {
	padding: 2px;
	/*border-right: solid gray 1px;
	border-bottom: solid gray 1px;*/
	}

	#comingsoon small {
	color: black;
	font-variant: small-caps;
	}

	
	a#imdb {
 	color: blue;
 	}
 	
	a#comson {
  	color: #14556B;
	}
	

	#footer {
	clear: both;
	padding: 5 px;
	margin-top: 3 px;
	border-top: 2px solid #294E56;
	font-size: 0.7em;
	color: black;
	font-weight: bold;
	letter-spacing: 1.2em;
	text-align: center;
	}
	
	#footer p {
	margin-top: 25px;
	margin-bottom: -10px;
	}
	
	#footer h4 	{
	font-size: 0.6em;
	color: black;
	font-weight: italic;
	letter-spacing: 1.2px;
	}
	
	#footer a {
   color: gray;
		padding: 0;
		text-decoration: none;
	}

	#footer a:hover {
  		letter-spacing: .2em;
	  	color: #660000;
		font-size: 1.8 em;
		font-weight: bold;
	}


/* tooltip for coming soon images first one */
#	a.tooltip{position:relative;           /*this is the key*/
        z-index:24;
        background-color:#ffffff;    /* background colour of display text */
        color:#00ff00;  		       /* colour of display text */
        border:1px solid black;    /* border colour */
        text-decoration:none;
        font-style:bold;
				 }
	
  	a.tooltip:hover {
        z-index:25;
        /*background-color:#ffffff;*/

        }

 	a.tooltip span {
        display: none;  /* hide the span text using this css */
        }
				
  	a.tooltip:hover span { /*the span will display just on :hover state*/
        display:block;
        position:absolute;
        top:45em;
        left: 38em;
        width: 0em;
      /*  border:1px solid #ff0000; */ /* border colour removed to just display image and no text */
        background-color:#ffffff; /* background colour here */
        color:#000000;         /* text colour */
        text-align: center;
        font-size: 95%;
        font-style:bold;
        z-index:30;
        }

        .images {
        vertical-align:bottom;
        }
/* end of tooltip coming soon images first one*/

/* tooltip for coming soon images second one*/
#a.tooltipz{
        position:relative;           /*this is the key*/
        z-index:24;
        background-color:#ffffff;    /* background colour of display text */
        color:#00ff00;               /* colour of display text */
        border:1px solid black;    /* border colour */
        text-decoration:none;
        font-style:bold;
        }

  	a.tooltipz:hover {
        z-index:25;
        background-color:#ffffff;

        }

 	a.tooltipz span{
        display: none;  /* hide the span text using this css */
        }
				
  	a.tooltipz:hover span{ /*the span will display just on :hover state*/
        display:block;
        position:absolute;
        top: 106em;
        left: 24em;
        width: 0em;
      /*  border:1px solid #ff0000; */ /* border colour removed to just display image and no text */
        background-color:#ffffff; /* background colour here */
        color:#000000;         /* text colour */
        text-align: center;
        font-size: 95%;
        font-style:bold;
        z-index:30;
        }

        .images {
        vertical-align:bottom;
        }
/* end of tooltip coming soon images second one */



/* tooltip2 for history images */
#  a.tooltip2{position:relative;           /*this is the key*/
        z-index:24;
        background-color:#ffffff;    /* background colour of display text */
        color:#00ff00;               /* colour of display text */
        border:3px solid black;    /* border colour */
        text-decoration:none;
        font-style:bold;
        }

 	 a.tooltip2:hover {
        z-index:25;
        background-color:#ffffff;

        }

 	a.tooltip2 span{
        display: none;  /* hide the span text using this css */
        }
				
 	 a.tooltip2:hover span{ /*the span will display just on :hover state*/
        display:block;
        position:absolute;
        top:82em;
        left: 31em;
        width: 0em;
      /*  border:1px solid #ff0000; */ /* border colour removed to just display image and no text */
        background-color:#ffffff; /* background colour here */
        color:#000000;         /* text colour */
        z-index:30;
        }

        .images {
        vertical-align:bottom;
        }
/* end of tooltip2 history images */

	img.floatRight {
   	 float: right;
    	margin: 24px;
 	 border: none;
   	}


	img.floatLeft {
	float: left;
	margin: 15px;
	padding-right: 20px;
	padding-left: 450px;
	padding-top: 10px;
	padding-bottom: 10px;
	border: none;
	}
			
	/* tooltipr */
	
	a.tooltipr{position:relative;           /*this is the key*/
z-index:24;
        background-color:#ffffff;    /* background colour of display text */
        color:#00ff00;               /* colour of display text */
        border:3px solid black;    /* border colour */
        text-decoration:none;
        font-style:bold;
        }

 	a.tooltipr:hover {
        z-index:25;
        background-color:#ffffff;

        }

 	a.tooltipr span {
        	display: none;  /* hide the span text using this css */
        }
				
  	a.tooltipr:hover span{ /*the span will display just on :hover state*/
        	display:block;
        	position:absolute;
       	 top:45em;
       	 left: 41em;
       	 width: 0em;
      /*  border:1px solid #ff0000; */ /* border colour removed to just display image and no text */
       	 background-color:#ffffff; /* background colour here */
       	 color:#000000;         /* text colour */
        	z-index:30;
       	 }

        .images {
        vertical-align:bottom;
        }
/* end of tooltipr*/

        #nowshowing h2.movietitle {
	    font-size: 1.4em;
	    font-family: Georgia, Arial, sans-serif;*/
	    line-height: 1.3em;
	    color: #47476b; /*#627081;*/
	    margin: -2% 0 1.5% 175px;
		
	}
	
	#comingsoon h2.movietitle {
	font-size: 1.12em;
	font-family: Georgia, Arial, sans-serif;
	line-height: 0.75em;
	color: #47476b;
	margin: 5px 0 1.1% 1px;
	
	}
	
	#comingsoon h2.movietitle a {
	
	font-size: 0.9em;
	
	
	}
	
	
	#comingsoon h3.movietitle {
	font-size: 0.8em;
	color: #450f1c;
	margin-top: -4px;
	margin-bottom: 3px;
	}

	#nowshowing h3.movietitle {
	font-size: 1em;
	color: #450f1c;
	padding: 3px;
	line-height: 1.2em;
	margin: -1% 0 2.5% 175px;
	
	}
	
		/* for small screens this only works if you have a "meta name=viewport statement" in the html head*/
		
	
	@media only screen and (max-width: 481px)  /*mobile responsive code */
	
	{
	#background {max-width: 94%; margin: 6% 2% 6% 2%; }
	#banner {float: none; padding: 0; margin: 0;}
	img.logofaces  {position: relative; /*width: 26%;*/ display: inline; float: right; margin: -4% 15% 0 0; padding:0;} /* gets rid of logo image for phones */
	#mainNav {float: left; /*width: 50%;*/ margin: 1% 4% 6% 1%; padding: 4%; }
	#mainNav li a, #mainNav li h4, #mainNav li {font-size: 105%; line-height: 95%;}
	#gh1 {margin: -2% 0 2% 0; padding: 0 0 0 5%; font-size: 350%; } /*cn theater */
	#gh2 {margin: 0; padding: 0 0 0 7%; margin-bottom: 3%; font-size: 120%;} /*digital cinenma... */
	#nowshowing h3.movietitle {margin: 0; margin-top: -2%; padding: 0;  float: none; font-size: 115%;} /*date*/
	#nowshowing h2.movietitle {margin: 0;  margin-bottom: 15%; padding: 0; float: none; font-size: 150%;} /*title*/
	#nowshowing img {margin: 0  5% 7% 0; width: 40%; float: left; border-radius: 4%;}
	p.byline2  {font-size: 95%; margin-top: 5%; padding: 0;}	
	h2.movietitle {margin-bottom: 1%; padding-bottom: 0; }
	/*img.logo {padding: 0; margin: 0;}*/
	
	
	@keyframes logo, logofaces
	{
	0% {left: 120%; transform: rotate(0) scale(.75);}
	70% {transform: rotate(-720deg) scale(.75); left: 0;}
	100% {	transform: rotate(0) scale(.86);}
	}	 /*end @keyframes*/
	}	/* end small screens  */