﻿
/***************************************************************************************************/

/***************************************************************************************************/
/*use em for sizing fonts. em is a term for the letter M indicated that the space
 that will be reserved by the font will equal the space the letter M occupies.
px should not be used, it can not be resized in the user's browser window.
1 em will be viewed as the userbrowser's default font size
 (or the the font size the user selected as the default font size)
.9 em is 10% smaller than 1 em; 1.1 em is 10% larger than 1 em.*/   

/***************************************************************************************************/
/* Apply the css reset to all pages. The css reset zeros out all the default setting that browsers have for fonts, borders, margins, padding, etc.*/

css reset tag selectors /*Note no periods.Tag selectors do not have the periold in front of them. Class selectors do.*/
html, body, h1, h2, h3, h4, h5, h6, p, ol, ul, li, pre, code, address, variable, form, fieldset, blockquote
 {
 padding: 0;
 margin: 0;
 font-size: 100%;
 font-weight: normal; 
}

table { border-collapse: collapse; border-spacing: 0; }
td, th, caption { font-weight: normal; text-align: left; }
img, fieldset { border: 0; }
ol { padding-left: 1.4em; list-style: decimal; }
ul { padding-left: 1.4em; list-style:square; }
q:before, q:after { content:''; }

/*------------------css re-set ends here----------------------------------------------*/

 /************Basic Structure begins ************/ 
 
/*to make the top drop down to the centered position*/
	html {
    padding:0; 
    margin: 0;
	}

	.bffphoto {
    padding-top: 2px;
	width: 100%;
	height: 300px;  
	background-image: url(Banff_Image_2026.jpg);	
    background-repeat: no-repeat;
    background-position: center center;
	background-size: contain;
    background-color: black;
    margin-left: auto;
	margin-right: auto;
	display: block;	    
	}

	body{
    margin:0;
    padding: 20px;
    font-family: Arial Narrow;
    font-size: 62.5%; /*sets the font so that 1em is 10pts, 2 em is 20pts etc.*/
    font-weight: normal;
    color: white;
    line-height: normal;	
	background-color: black;
	/*#E0EEEE;*/	
	}	
  
    /*background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;*/

	p  {
    font-family: Helvetica, Swiss, Arial, san-serif;
    margin-top: 10px;
    line-height: 150%;    	
	}

	.font1{
	font-family: Arial Narrow; 
    font-size:1rem;
    font-weight: bold;
    color: white;
	}

	.font2 {
    font-size:.75rem;
    font-weight: bold;
    color: #678AB0;
	}

	.font3 {     
    font-family: 'Homemade Apple', cursive;
    font-size: 1rem;
    font-weight: bold;
    line-height:175%;	
	color: white;
    word-spacing:10px;      
	}
	
	.italic{
	font-style: italic;
	}

	/* to eliminate the border around images that IE places*/
	img {
	border: none;
	}

	h{
    font-weight: bold;
	font-style: italic;
    font-size: 1.25rem;    
	text-align: center;
	}	
	h1{
    font-weight: bold;
    font-size: 2rem;
    color: white;    
	text-align: center;
	}

	h2{
    font-weight: bold;
    font-size: 1.25rem;    
	text-align: center;font
	/*line-height: 125%;*/
	color: white;
	padding-top: 20px;
	}


	h3{
    font-weight: bold;
	font-size: 1.25rem;
    /*line-height: 125%;*/
    text-align: center;
	color: white;
	}	


	
	/************Basic Structure ends ************/ 
    
	.bffwrapper  {
    width:100%;     	
    margin-left: auto;
	margin-right: auto;
   /* background-color: #6699ff;*/	
	}

	/***************************************************************************************************/

	.menu2 a {
	display:block; /*makes the list vertical*/
    width: 15rem;
    height: 3rem;
    line-height:3rem;	
    background-color:#678AB0;
    margin-left: auto;  /* centers the list*/
    margin-right: auto;  /* centers the list*/
	font-size: 1.5rem;
	border-bottom: 1px dashed #000;
    text-decoration: none; /*removes hyperlink underline*/
	}
 
	.menu2 ul {
    margin-left: 0; /*padding and margin must be zeroed out in the unordered list because a left indent is automatically applied to an unordered list*/
    padding-left:0;    
    list-style-type:none;
	text-decoration: none;    	
	}
	
  /*spread out buttons so they don't touch*/
	.menu2 li {
	 margin-top: 10px;
	 margin-bottom: 10px;
     text-align: center;    	 
	}

	.menu2 ul li a span {
    padding:12px 9px; 
    font-weight: bold;
    color:white;	
	}

	.menu2 ul li a:hover span {
    color:white;
    font-weight: bold;    
    text-transform:uppercase;		 
	}

	.active{
    color:white ;
    font-weight:bold; 
    text-transform:uppercase;	
	} 
	
	.menu3 a {
	display:block; /*makes the list vertical*/
    width: 10rem;
    height: 1.5rem;
    line-height:1.5rem;	
    background-color:#678AB0;
    margin-left: auto;  /* centers the list*/
    margin-right: auto;  /* centers the list*/
	font-size: .75rem;
	border-bottom: 1px dashed #000;
    text-decoration: none; /*removes hyperlink underline*/
	}
 
	.menu3 ul {
    margin-left: 0; /*padding and margin must be zeroed out in the unordered list because a left indent is automatically applied to an unordered list*/
    padding-left:0;    
    list-style-type:none;
	text-decoration: none;    	
	}
 
  	/*spread out buttons so they don't touch*/
	.menu3 li {
	 margin-top: 10px;
	 margin-bottom: 10px;
     text-align: center;    	 
	}

	.menu3 ul li a span {
    padding:12px 9px; 
    font-weight: bold;
    color:white;	
	}

	.menu3 ul li a:hover span {
    color:#white;
    font-weight: bold;    
    text-transform:uppercase;		 
	}

	.horizontallinedecoration{
	width: 250px;
	border-bottom: 2px solid #003366;
	margin: 0 auto 0 auto;
	padding-bottom: 20px;
	padding-top:20 px;
	}

	p.clr, .clear { 
    clear:both; padding:0; margin:0; 
	}
	
	.clear { 
    clear:both; padding:0; margin:0; 
	}

	.center {
	 width: auto;
	 margin-left: auto;
     margin-right: auto;
     display: block;
	 text-align: center;
	}

	.center2 {
	margin: auto;
	width: 90%;
	/*border: 3px solid #73AD21;*/
	padding: 10px;
	}
  
	
	.increaseleading{    
	word-spacing: 10px;
    letter-spacing: 10px;
    text-align: center;
    /*line-height: 150%;
     /*padding-bottom: 40px;
	 /*padding-top: 40px;*/
	font-weight: normal;
	}

	.increasepaddingtop10{
	padding-top: 10px;
	}

	.increasepaddingtop20{
	padding-top: 20px;
	}
	
	.increasepaddingbtm10{
	padding-bottom: 10px;
	}
	.link { 	
	color: white;
	}

	.linkblue { 	
	color: white;
	}

	a:link {
	color: white;
	}
	
	 
	a:visited {
	color: white;
	}
	
	.bold{
	 font-weight: bold;
	
	/*beginning of mark-up for film description pages*/

	.descriptions{
		margin-right:60px;
		margin-left: 60px;
		color: black;
		background-color: white;		
	}


	p.lineone	{
		font-size: 1rem;		
		/*line-height: 175%;*/
		font-style: italic;
		font-weight: bold;		
	}
	
	p.linetwo	{
		/*font-size: 1rem;	
		line-height: 100%;*/
		margin-top: -.01em;		
	}
	
	p.linethree	{
		/*font-size: 1rem;
		line-height: 150%;*/
		margin-top: -.01em;
		margin-bottom: 2em;		
	}
	
}