/*
!!!!!!!CINEMATHEQUE STYLESHEET!!!!!!
*/

body {
background-color: black;
}

h1{
}
h2{
}
h3{
}
A:link, A:visited, A:active { text-decoration: none;  outline: none;}

A:link { color: #A91624;
}
A:visited { color: #662028;
}
A:active {
}
A:hover { text-decoration: underline;
}
p { 
text-align: justify;}

/* The Following Code is for the header, the header image and the blurb with the venue and ticket details.
*/

#header {
color: #FFF8A1;
font-weight: bold;
background-color: #131413;
position: absolute; 
top: 0px;
left: 20px;
width: 840px;
height: 115px;
padding-left: 20px;
padding-right: 5px;
padding-top: 15px;
padding-bottom: 34px;
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 1.8em;
display: block;
border-right: solid #FFF8A1 1px;
border-left: solid #FFF8A1 1px;
border-bottom: solid #FFF8A1 1px;
}

#headerslug{
position: absolute;
top: 110px; 
padding: 0px;
left: 60px;
width: 280px;
font-family: Verdana, Helvetica, Arial, sans-serif;
}

#headerslug h1{
color: #A91624; 
font-size: .6em;
line-height: 0.0em;
}

#headerslug p {
color: #FFF8A1 ;
font-size: .6em;
line-height: 1.1em;
}

#headerblurb{
position: absolute;
top: 0px; 
padding: 2px;
left: 623px;
width: 250px;
font-family: Verdana, Helvetica, Arial, sans-serif;
}

#headerblurb h1 {
color: #A91624; 
font-size: 0.6em;
line-height: 0.2em;
}

#headerblurb p {
color: #FFF8A1 ;
font-size: 0.6em;
line-height: 1.1em}

#headerimage{
position: absolute;
left: 46px;
top: 0px;
}

#headerimage2{
position: absolute;
left: 400px;
top: 0px;
width: 300px;
border-bottom: solid #FFF8A1 1px;
}

/*

The following code covers the sidebar in "left.html" 

*/

#navbar {
color: #FFF8A1;
position: absolute;
top: 0px;
left: 20px;
height: 1000px;
width: 200px;
background-color: #131413; 
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: .7em;
line-height: 1.2em;
border-left: solid #FFF8A1 1px;
border-right: solid #FFF8A1 1px;
}

#navbar ul {
list-style-type: none;
}

#navbar p {
font-size: 0.8em;
}

#navbar li {
border-bottom: solid #FFF8A1 1px;
padding: 4px;
}

#navbarA:link, A:visited, A:active { text-decoration: none; }

#navbar A:link { color: #FFF8A1;
}
#navbar A:visited { color: #FFF8A1;
}
#navbar A:active { color: #FFF8A1;
}
#navbar A:hover { background-color: lightgrey;
color: #A91624; 
}

/* content general */

#content {
position: absolute;
top: 5px;
left: 1px;
background-image: url(images/gradient1.png);
background-repeat: repeat-x; 
width: 632px;
font-family: Verdana, Helvetica, Arial, sans-serif;
border-right: solid #000000 1px;
padding-left: 12px;
padding-right: 12px;
padding-bottom: 600px;
}

#content p {
font-size: .7em;
line-height: 1.6em; 
}

#content h1 {
font-size: 1.2em;
color: #A91624; 
}

#content h2 {
font-size: 1.0em;
#662028;
}

#content h3 {
font-size: .9em;
#662028;
}

/*code for the film searchbar that appears on each film page*/

#browser {
position: absolute;
top: 0px;
left: 0px;
background-image: url(images/gradient2a.png);
background-repeat: repeat-x; 
width: 637px;
height: 140px;
font-family: Verdana, Helvetica, Arial, sans-serif;
padding-top: 2px;
padding-left: 20px;
padding-bottom: 5px;
padding-right: 0px;
border-bottom: solid #000000 1px;
}


#browser h1 {
font-size: 0.6em;
line-hieght: 0.1em;
text-align: center;
color: #662028;
}

#browser h3 {
font-size: 0.6em;
line-hieght: 0.1em;
text-align: left;
color: #662028;
}

#browser p {
font-size: .6em;
line-height: 0.1em;
text-align: left;
}

/* code for the film pages and the screenings 2007 page */

#filmcontent {
position: absolute;
top: 0px;
left: 0px;
background-image: url(images/gradient1.png);
background-repeat: repeat-x; 
width: 617px;
font-family: Verdana, Helvetica, Arial, sans-serif;
padding-left: 20px;
padding-right: 20px;
padding-top: 145px;
padding-bottom: 200px;
border-right: solid #000000 1px;

}


#filmcontent p {
font-size: .7em;
line-height: 1.6em; 
}

#filmcontent h1 {
color: #A91624; 
font-size: 1.4em;
line-height: .6em;
}

#filmcontent h2 {
font-size: 0.9em;
#662028;
}

#filmcontent h3 {
font-size: 0.9em;
text-align: center;
color: #662028;
}

#filmcontent h4 {
font-size: 0.7em;
}

#filmcontent h5 {
font-size: 0.8em;
line-height: 1.4em; 
}

/* content for the restrospectives which basically accounts for the quicknav floaty bar */

#retrospect {
position: absolute;
top: 0px;
left: 0px;
width: 617px;
background-image: url(images/gradient1a.png);
background-repeat: repeat-x; 
font-family: Verdana, Helvetica, Arial, sans-serif;
padding-left: 20px;
padding-right: 20px;
padding-top: 100px;
border-right: solid #000000 1px;
}

#retrospect img {
align: center; 
}


#retrospect p {
padding-left: 12px;
padding-right: 12px;
font-size: .7em;
line-height: 1.7em;
}

#retrospect h1 {
text-align: center;
font-size: 1.2em;
line-height: 1.2em;
color: #A91624;
}

#retrospect h2 {
font-size: 1.2em;
line-height: .2em;
padding: 12px;
color: #A91624;
}

#retrospect h3 {
font-size: .9em;
line-height: 0.2em;
text-align: center;
color: #662028;
padding-top: 12px;
padding-bottom: 12px;
}

#retrospect h4 {
font-size: .8em;
line-height: .2em;
text-align: left;
padding: 12px;
line-height: 0.05em;
}

#retrospect A:link, A:visited, A:active A:name { text-decoration: none; }

/* quicknav is the code for the little floating menu that persists when you scroll down, so the user may quickly jump between sections */

#quicknav {
position: fixed;
text-align: center;
background-image: url(images/gradient2b.png);
background-repeat: repeat-x; 
top: 0px;
left: 0px;
width: 651px;
font-size: .6em;
font-family: Verdana, Helvetica, Arial, sans-serif;
padding-left: 6px;
padding-bottom: 5px;
border-bottom: solid #000000 1px;
}

#quicknav h1{
color: #662028;
font-size: 1.2em;
}

#quicknav h2{font-size: 1.0em;
}

#quicknav p{
}

/* 

The following code is for the Main Page or "Main.html" */
 
/* "Welcome" covers the main text section */

#welcome {
position: absolute;
background-image: url(images/gradient1.png);
background-repeat: repeat-x; 
top: 5px;
left: 0px;
width: 370px;
font-family: Verdana, Helvetica, Arial, sans-serif;
padding: 12px;
padding-bottom: 390px;
border-right: solid #000000 1px;
}



#welcome h2{
font-size: .8em;
color: #A91624;

}

#welcome p{
text-align: justify;
font-size: .7em;
line-height: 1.6em;
}


/* 

"Now Showing" covers the current screening section - must be updated weekly. I have created distinct headers under nowshowing h1 etc and made it so the images always sit on the top 
right. Makes it easy to change the content of this panel.

*/

#nowshowing {
position: absolute;
background-image: url(images/gradient2.png);
background-repeat: repeat-x; 
top: 5px;
left: 400px;
height: 416px;
width: 236px;
font-family: Verdana, Helvetica, Arial, sans-serif;
padding: 10px;
border-right: solid #000000 1px;
border-bottom: solid #000000 1px;
}

#nowshowing h1{
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: .8em;
color: #662028;
}

#nowshowing h2{
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: .7em;
color: #A91624;
}

#nowshowing p{
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: .6em;
}

/* "Special Seasons" is the permanent listing of links to special seasons */

#specialseasons {
position: absolute;
background-image: url(images/gradient3.png);
background-repeat: repeat-x; 
top: 445px;
left: 400px;
height: 180px;
width: 236px;
font-family: Verdana, Helvetica, Arial, sans-serif;
padding: 10px;
padding-bottom: 1373px;
border-right: solid #000000 1px;
}

#specialseasons h1{
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: .8em;
color: #662028;
}

#specialseasons h2{
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: .6em;
}

#specialseasons h3{
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: .5em;
}