/*
Cinematheque 2008 Stylesheet
*/

body {
background-color: #ffffff;
margin-top: 5px;
text-align: justify;
font-size: 0.8em;
line-height: 1.2em;
}

h1{
color: #222222; 
font-size: 1.6em;
line-height: 1.2em;
}

h2{
color: #222222;
font-size: 1.2em;
line-height: 1.2em;
}

h3{
font-size: 1.2em;
color: #888888;
}

h4{
color: #222222;
font-size: 1.0em;
}

A:link, A:visited, A:active {color: #111111; text-decoration: none;  outline: none; padding: 2px; }

A:link { 
text-decoration: bold;
}
A:visited { color: #111111;
}
A:active {
}
A:hover {background-color: #eeeeee;
}

p { 
}


/*
The following code works with the header.
*/

#header {
position: relative;
background-color: transparent;
color: #000000;
height: 147px;
width: 762px; 
font-family: Verdana, Helvetica, Arial, sans-serif;
margin: 0px auto;
border-bottom: solid #000000 1px;
}

#tab1 {
position: absolute;
top: 150px;
left: 0px;
color: #000000;
font-size: 0.9em;
background-color: #ffffff;
width: 60px;
padding: 5px;
}

#tab2 {
position: absolute;
top: 150px;
left: 80px;
color: #000000;
font-size: 0.9em;
background-color: #ffffff;
width: 70px;
padding: 5px;
}

#tab3 {
position: absolute;
top: 150px;
left: 160px;
color: #000000;
font-size: 0.9em;
background-color: #ffffff;
width: 150px;
padding: 5px;
}

#tab4 {
position: absolute;
top: 150px;
left: 310px;
color: #000000;
font-size: 0.9em;
background-color: #ffffff;
width: 160px;
padding: 5px;
}

#tab5 {
position: absolute;
top: 150px;
left: 490px;
color: #000000;
font-size: 0.9em;
background-color: #ffffff;
width: 135px;
padding: 5px;
}

#tab6 {
position: absolute;
top: 150px;
left: 645px;
color: #000000;
font-size: 0.9em;
background-color: #ffffff;
width: 80px;
padding: 5px;
}

#contentframe {
position: absolute;
background-color: #ffffff;
top: 178px;
width: 760px; 
height: 900px;
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 0.8em;
color: #000000;
margin:0px auto; 
border-top: solid #000000 1px;
}

#contentframeabout {
position: absolute;
background-color: #ffffff;
top: 177px;
width: 760px; 
height: 1200px;
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 0.8em;
color: #000000;
margin:0px auto; 
border-top: solid #000000 1px;
}


/*
The following code relates to the content of the main page. 
*/

#mainframe {
position: relative;
top: 36px; 
background-color: #ffffff;
left: 0px;
padding-left: 20px;
padding-right: 40px;
width: 350px; 
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 0.8em;
color: #666666; 
}

#nextscreeningsframe {
position: absolute;
float: top;
top: 200px;
background-color: #eeeeee;
left: 420px;
padding-top: 2px; 
padding-left: 20px; 
padding-right: 20px;
padding-bottom: 20px;
width: 300px;
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 0.8em;
color: #333333; 
}

/*
The following code relates to the content of the about page. 
*/

#aboutframe {
position: relative;
top: 45px; 
background-color: #ffffff;
left: 0px;
padding-left: 20px;
padding-right: 40px;
width: 700px; 
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 0.8em;
color: #666666;
overflow: auto;
}

/*
The following code relates to the content of the screenings 2008 page. 
*/

#screeningsframe {
position: relative;
top: 32px; 
background-color: #ffffff;
left: 0px;
padding-left: 20px;
padding-right: 40px;
width: 700px; 
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 0.8em;
color: #666666; 
}

/* the following code relates the the drop down menus for navigating the film screenings */

.menu2 {
float:left; width:693px; 
font-family: verdana, arial, sans-serif; 
font-size:11px; 
border-top:1px solid #cccccc;
border-left:1px solid #cccccc;
background:#dddddd url(images/menu2.gif) repeat-x; 
margin: 0px 0 15px 3px ; /* for this demo only */ 
}

.menu2 ul {
padding:0;margin:0;list-style-type:none; 
}

.menu2 ul li {
float:left;
position:relative;
border-right:1px solid #cccccc; 
border-bottom:1px solid #cccccc;
}

.menu2 ul li.group {display:block; text-indent:10px; background:#666; color:#cccccc; width:152px; padding:5px; }

.menu2 ul li a, .menu2 ul li a:visited {
float:left; display:block; text-decoration:none; color:#444; padding:0px 16px; line-height:30px; height:30px; width:198px; 
}

.menu2 ul li:hover {width:auto;}

.menu2 ul li a:hover {background:#ffffff url(images/sub2a.gif); color:#000000;}

.menu2 ul li:hover a {background:#ffffff url(images/sub2a.gif); color:#000000;}

.menu2 ul li ul {
display: none;
}
.menu2 table {
margin:0; border-collapse:collapse; font-size:11px; position:absolute; top:0; left:0;
}

/* specific to non IE browsers */

.menu2 ul li:hover ul {
display:block; 
position:absolute;
top:29px; 
background:#dddddd; 
margin-top:1px; 
left:0; 
width:152px;
}

.menu2 ul li:hover ul.scroller {
height:200px; width:230px; overflow:auto;}


.menu2 ul li:hover ul.endstop {
left:-90px;
}

.menu2 ul li:hover ul li ul {
display: none;
}

.menu2 ul li:hover ul li a {
display:block; 
background:#dddddd; 
color:#ccccccc;
height:auto;
line-height:15px;
padding:4px 16px; 
width:182px;
}

.menu2 ul li:hover ul li a.drop {
background:#ffffff; 
color:#000000;
}

.menu2 ul li:hover ul li a:hover {
color:#000000; 
background: #ffffff;
}

.menu2 ul li:hover ul li:hover ul {
display:block; 
position:absolute; 
left:153px; 
top:-70px;
color:#000; 
left:152px; 
height:138px; 
width:172px; 
overflow:auto; 
background:#888;
}

.menu2 ul li:hover ul li:hover ul li a {
background:#888;
}

#menu2 ul li:hover ul li:hover ul li.group {
width:152px; padding:5px 0;
}

#menu2 ul li:hover ul li:hover ul.left {
left:-172px;
}
.menu2 ul li:hover ul li:hover ul li a:hover {
background:#666; color:#0ff;
}


/* specific to IE5.5 and IE6 browsers */

.menu2 ul li a:hover ul {
display:block;position:absolute;top:30px; t\op:29px; background:#aaa;left:0; marg\in-top:1px;
}

.menu2 ul li a:hover ul.scroller {
height:200px; width:230px; overflow:auto;}

.menu2 ul li a:hover ul.endstop {
left: -90px;
}

.menu2 ul li a:hover ul li a {
display:block; color:#fff; height:1px; line-height:15px; padding:4px 16px; width:152px; w\idth:182px;
}

.menu2 ul li a:hover ul li a.drop {
background:#888; padding-bottom:5px;
}

.menu2 ul li a:hover ul li a ul {
visibility:hidden; position:absolute; height:0; width:0;
}

.menu2 ul li a:hover ul li a:hover {
color:#ff0; background: #888;
}

.menu2 ul li a:hover ul li a:hover.drop {
 background: #888; color:#ff0;
}

.menu2 ul li a:hover ul li a:hover ul {
visibility:visible; position:absolute; top:-69px; t\op:-70px; color:#000; left:152px; height:138px; width:170px; overflow:auto; background:#888;
}

.menu2 ul li a:hover ul li a:hover ul.left {
left:-170px;
}

.menu2 ul li a:hover ul li a:hover ul li a:hover {background:#666; color:#0ff;}

.left {clear:both;}


<!--[if lte IE 7]>
<style type="text/css">
/* not validating css */
.menu2
{
  scrollbar-face-color:#ddd;
  scrollbar-arrow-color:#000;
  scrollbar-track-color:#aaa;
  scrollbar-shadow-color:#ddd;
  scrollbar-highlight-color:#eee;
  scrollbar-3dlight-color:#eee;
  scrollbar-darkshadow-Color:#ddd;
}
</style>
<![endif]-->

/*
The following code relates to the content of the cteq annotations page. 
*/

#cteq {
position: relative;
top: 36px; 
background-color: #ffffff;
left: 0px;
padding-left: 20px;
padding-right: 40px;
width: 700px; 
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 0.8em;
color: #666666;
overflow: auto;
}


/*
The following code relates to the footer.
*/

#footer { 
position: relative;
top: 100px;
background-color: #ffffff; 
color: #0000000;
width: 780px;
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 0.8em;
padding: 2px;
padding-left: 10px;
border-top: solid #000000 1px;
}

#footermain { 
position: relative;
top: 100px;
background-color: #ffffff; 
color: #0000000;
width: 780px;
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 0.8em;
padding: 2px;
padding-left: 10px;
border-top: solid #000000 1px;
}

#footerabout { 
position: relative;
top: 70px;
background-color: #ffffff; 
color: #0000000;
width: 780px;
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 0.8em;
padding: 2px;
padding-left: 10px;
border-top: solid #000000 1px;
}

#footer A:link { color: #000000;
text-decoration: bold;
}
#footer A:visited { color: #000000;
}
#footer A:active {
}
#footer A:hover {
}