/* 
===================== COLOUR PALETTE =====================
E60000 This red
CC0000 dark red
E2E9F0 light grey.blue
A1A5AB mid grey/blue
696969 dark grey
999999 mid grey
336699 dark blue
2A5680 darker blue
===================== COLOUR PALETTE =====================
*/


/* ===================== BASIC SETTINGS ===================== */

body 
{
margin: 0;
padding: 0;
font-family: Verdana, Helvetica, Arial, sans-serif;
text-align: center;
background: #ffffff url(../med/bg.gif) repeat-y 50% 0px;
font-size: x-small; /* IE5 Win */
voice-family: "\"}\""; 
voice-family: inherit;
font-size: small;
}

html>body
{ 
/* be nice to Opera */
font-size: small;
}

h2, h3, h4, h5, h6 {
margin: 0px;
padding: 0px;
}

.red
{
color: #E60000;
}

/* ===================== FONT RESIZER ===================== */
/* default font size*/
@import url(small.css);

/* Netscape 4 safe font sizes 
body, div, p, th, td, li, dd {
  font-family: Verdana, Helvetica, Arial, sans-serif;
  font-size: x-small;
}
*/

h1 {
  font-size: 130%;
  font-weight: bold;
}

h2 {
  font-size: 110%;
  font-weight: bold;
}

h3 {
  font-size: 90%;
  font-weight: bold;
}
/* END FONT RESIZER */



/* ===================== MAIN SECTION IDs ===================== */

div#container
{
width:749px;
margin-right:auto;
margin-left:auto;
margin-top:0px;
padding:0px;
text-align: left;
}

#leftcol
{
width: 152px;
float: left;
}

#centercol
{
float:left;
width: 437px;
}

#rightcol
{
float: left;
width: 160px;
}

#footer
{
margin-left: 164px;
margin-top: 20px;
}

/* ===================== BANNER AND BREADCRUBMS ===================== */

#header h1
{ 
/* Size of the image*/ 
padding-top: 107px; width: 749px; 

/* The image*/ 
background-image: url(../med/rotate_home/rotate.php?); background-repeat: no-repeat; 

/* Hide the text*/ overflow: hidden; 

/* WIN IE5 hack */ 
height: 107px; 
voice-family: "\"}\""; 
voice-family:inherit; 
height: 0;
margin: 0px; 
}

#breadcrumbs
{
margin-left: 10px;
margin-top: 2px;
color: #999999;
font-size: 90%;
}

#search
{

}


/* ===================== NAVIGATION ===================== */

div#navbar 
{

}

#navbar ul
{
font-size: 11px;
font-weight: bold;
width: 151px;
list-style: none;
padding: 0;
border: none;
margin-top: 0px;
margin-left: 0px;
margin-bottom: 0px;
margin-right: 0px; 
}

#navbar a:link, #navbar a:visited 
{
font-family: Arial, sans-serif;
font-size: 11px;
color: #000000;
background-color: #e2e9f0;
text-decoration: none;
display: block;
border-bottom: solid #ffffff 1px;
padding-top: 3px;
padding-bottom: 3px;
padding-left:12px;
}

#navbar a:hover, #navbar a.current, #navbar a.current:visited
{
font-family: Arial, sans-serif;
font-size: 11px;
color: #ffffff;
background-color: #b1b7bc;
text-decoration: none;
}

#navbar li.first
{
border-top: solid #ffffff 1px;
}

#navbar li.spacer
{
height: 16px;
}

/* ===================== LEFT COLUMN ===================== */

.leftcolelements
{
display: block;
margin-top: 20px;
}

.leftcolelements p
{
margin-top: 8px;
margin-left: 12px;
margin-right: 4px;
}

.leftcolelements a:link, .leftcolelements a:visited, .leftcolelements a:hover
{
font-size: x-small;
}


/* ===================== FILM CLUB ===================== */

#filmclub
{
margin-top: 26px;
}

#filmclub .zf_news
{
margin-left: 12px;
margin-right: 8px;
}

#filmclub h6
{ 
/*Size of the image*/ 
padding-top: 106px; width: 145px; 

/*The image*/ 
background-image: url(../med/film_club.gif); 
background-repeat: no-repeat; 

/*Hide the text*/ overflow: hidden; 

/* WIN IE5 hack */ 
height: 106px; 
voice-family: "\"}\""; 
voice-family:inherit; 
height: 0;
margin: 0px; 
}

.filmclubposts a:link, .filmclubposts a:visited, .filmclubposts a:hover
{
text-decoration: none;
font-size: x-small;
}

.filmclubposts a:hover
{
text-decoration: underline;
}


/* ===================== BLOG THIS ===================== */

#leftblogthis
{
margin-top: 26px;
margin-left: 12px;
margin-right: 8px;
}

#leftblogthis h6
{ 
/*Size of the image*/ 
padding-top: 19px; width: 69px;

/*The image*/ 
background-image: url(../med/blog_this_on_blue.gif); 
background-repeat: no-repeat;

/*Hide the text*/ overflow: hidden; 

/* WIN IE5 hack */ 
height: 19px; 
voice-family: "\"}\""; 
voice-family:inherit; 
height: 0;
margin: 0px; 
}

hr.dashed
{
border: none;
border-top: 1px black dashed;
}

#leftblogthis p
{

}

.blogthisposts a:link, .blogthisposts a:visited, .blogthisposts a:hover
{
text-decoration: none;
font-size: x-small;
}

.blogthisposts a:hover
{
text-decoration: underline;
}

#rightcolblog
{
margin-left: 6px;
}

p.posted
{
font-style: italic;
}

.zf_news
{
margin-top: 6px;
}

/* ===================== STORY-SPECIFIC ELEMENTS ===================== */

#story
{
margin-left: 10px;
margin-right: 10px;
}

#story h2 {
color: red;
margin-top: 8px;
font-weight: bold;
font-size:130%;
text-transform: uppercase; 
}

#storydeck
{
float: left;
width: 280px;
margin-top: 10px;
margin-right: 4px;
}

#storydeck h3 {
font-weight: bold;
font-size: 95%; }

#story h4 
{
margin-top: 18px;
font-size: 90%;
font-weight: normal;
text-transform: uppercase;
}

* html #story h4
{
  margin-top: 26px;  /* for IE5.x/win */
  m\argin-top: 26px;   /* for other IE versions */
  font-size: x-small;
  f\ont-size: x-small;
}

#storytools
{
float: left;
border-left: dashed 1px #999999;
color: #999999;
margin-top: 10px;
}

#storytools ul
{
list-style: none;
padding: 0;
margin-left: 5px;
margin-bottom: 0px;
margin-top: 0px;
}

#storytools a:link, #storytools a:visited, #storytools a:hover
 {color: #999999;
text-decoration: none;
font-size: 11px; }

#storytools a:hover
{
text-decoration: underline;
}

#fontswitch
{
display: block;
margin-left: 6px;
}

#story p
{
line-height: 125%;
}

#story img
{
margin-top: 20px;
margin-left: 5px;
margin-bottom: 10px;
}

p.authorbio
{
width:395px;
font-style: italic;
}

.endofstory
{
margin-top: -20px;
margin-bottom: -10px;
}

p.blockquote
{
font-style: italic;
margin-left: 20px;
margin-right: 20px;
}

p.poem
{

}

/* ===================== ALSO IN AND ALSO BY ===================== */

#alsos
{
margin-left: 10px;
margin-right: 10px;
}

#alsoby
{
float: left;
width: 200px;
}

div#alsoin
{
float: right;
width: 200px;
}

#alsos ul
{
padding: 2px;
margin-left: 16px;
}

#alsos li
{
padding: 4px;
}

#alsos p
{
color: white;
font-weight: bold;
background-image: url(../med/contextual_corner.gif);
background-repeat: no-repeat;
background-position: right top;
background-color: #999999;
padding-left: 4px;
padding-top: 2px;
font-size: 12px;
}


/* ===================== RIGHT COLUMN ITEMS ===================== */

#rightcoltop
{
display: block;
position: relative;
z-index: 2;
width: 160px;
height: 112px;
background-image: url(../med/get_some_of_this.gif);
background-repeat: no-repeat;
margin-bottom: -5px;
}

#rightcoltop .textinput
{
border: 1px solid black;
background-color: white;
color: #818181;
font-size: x-small;
width: 140px;
height: 18px;
margin-top: 46px;
margin-bottom: 8px;
padding-left: 4px;
margin-left: 6px; }

#rightcoltop .submit
{
border: none;
color: white;
background-color: #818181;
font-weight: bold;
font-size: 12px;
margin-left: 6px; }

#rightcolsub
{
display: block; 
position: relative;
z-index: 1;
margin-bottom: 2px;
width: 160px;
}

* html #rightcolsub
{
  margin-bottom: 0px;  /* for IE5.x/win */
  m\argin-bottom: 0px;  /* for other IE versions */
}

#rightcoldon
{ 
display: block;
width: 160px;
margin-bottom: 2px;
}

* html #rightcoldon
{
  margin-bottom: 0px;  /* for IE5.x/win */
  m\argin-bottom: 0px;  /* for other IE versions */
}

#rightcolbot
{
display: block;
text-align: center;
}

#rightcolbot small
{
font-size: x-small;
}

/* ===================== ADVERTISING ===================== */


.adsSkyscraper
{
display: block;
margin-top: 10px;
}


/* ===================== FOOTER ===================== */

#footer
{
font-size: x-small;
}


/* ===================== HOME PAGE SPECIFIC ===================== */


#rightcolspread
{
display: block;
width: 160px;
}

#homepage
{
margin-left: 10px;
margin-right: 10px;
margin-top: 14px;
}

#homepage .topleft
{
float: left;
width: 170px;
}

#homepage .topright
{
float: right;
width: 230px;
}

#homepage h2
{
margin-top: 4px;
margin-bottom: 12px;
font-weight: bold;
font-size:120%;
text-transform: uppercase;
}

#homepage hr
{
border: 0px;
border-top: 1px solid #696969;
}

#digitalthis h3
{ 
/*Size of the image*/ 
padding-top: 17px; width: 96px; 

/*The image*/ 
background-image: url(../med/digital_this.gif); 
background-repeat: no-repeat;

/*Hide the text*/ overflow: hidden; 

/* WIN IE5 hack */ 
height: 17px; 
voice-family: "\"}\""; 
voice-family:inherit; 
height: 0;
margin: 0px; 
}

#digitalthis
{
margin-top: 8px;
}

#rememberthis h3
{ 
/*Size of the image*/ 
padding-top: 19px; width: 88px; 

/*The image*/ 
background-image: url(../med/remember_this.gif); 
background-repeat: no-repeat;

/*Hide the text*/ overflow: hidden; 

/* WIN IE5 hack */ 
height: 19px; 
voice-family: "\"}\""; 
voice-family:inherit; 
height: 0;
margin: 0px; 
}

#rememberthis
{
margin-top: 8px;
}

#rememberthis img
{
margin-top: 8px;
margin-left: 8px;
margin-bottom: 8px;
}


#classicthis h3
{ 
/*Size of the image*/ 
padding-top: 16px; width: 86px; 

/*The image*/ 
background-image: url(../med/classic_this.gif); 
background-repeat: no-repeat;

/*Hide the text*/ overflow: hidden; 

/* WIN IE5 hack */ 
height: 16px; 
voice-family: "\"}\""; 
voice-family:inherit; 
height: 0;
margin: 0px; 
}

#classicthis
{
margin-top: 8px;
}

#classicthis img
{
margin-top: 8px;
margin-left: 8px;
margin-bottom: 8px;
}

#dontmissthis h3
{ 
/*Size of the image*/ 
padding-top: 16px; width: 110px; 

/*The image*/ 
background-image: url(../med/dont_miss_this.gif); 
background-repeat: no-repeat;

/*Hide the text*/ overflow: hidden; 

/* WIN IE5 hack */ 
height: 16px; 
voice-family: "\"}\""; 
voice-family:inherit; 
height: 0;
margin: 0px; 
}

#dontmissthis
{
margin-top: 8px;
}

#dontmissthis img
{
margin-top: 8px;
margin-left: 8px;
margin-bottom: 8px;
}


#homepage .calloutbox:hover
{
background-color: #2A5680;
}

#homepage h3
{
font-size: 100%;
}

#homeblogthis
{
background: #E2E9F0;
padding: 4px;
}

#homeblogthis h4
{ 
/*Size of the image*/ 
padding-top: 19px; width: 74px; 

/*The image*/ 
background-image: url(../med/blog_this.gif); 
background-repeat: no-repeat;

/*Hide the text*/ overflow: hidden; 

/* WIN IE5 hack */ 
height: 19px; 
voice-family: "\"}\""; 
voice-family:inherit; 
height: 0;
margin: 0px; 
}


#homepage .left
{
float: left;
width: 202px;
margin-right: 10px;
}

#homepage .right
{
float: left;
width: 202px;
}

#hearthis h4
{ 
/*Size of the image*/ 
padding-top: 16px; width: 67px; 

/*The image*/ 
background-image: url(../med/hear_this.gif); 
background-repeat: no-repeat;

/*Hide the text*/ overflow: hidden; 

/* WIN IE5 hack */ 
height: 16px; 
voice-family: "\"}\""; 
voice-family:inherit; 
height: 0;
margin: 0px; 
}

#readthis h4
{ 
/*Size of the image*/ 
padding-top: 16px; width: 67px;

/*The image*/ 
background-image: url(../med/read_this.gif); 
background-repeat: no-repeat;

/*Hide the text*/ overflow: hidden; 

/* WIN IE5 hack */ 
height: 16px; 
voice-family: "\"}\""; 
voice-family:inherit; 
height: 0;
margin: 0px; 
}

#backstory h4
{ 
/*Size of the image*/ 
padding-top: 16px; width: 77px;

/*The image*/ 
background-image: url(../med/back_story.gif); 
background-repeat: no-repeat;

/*Hide the text*/ overflow: hidden; 

/* WIN IE5 hack */ 
height: 16px; 
voice-family: "\"}\""; 
voice-family:inherit; 
height: 0;
margin: 0px; 
}

#backstory img
{
margin-top: 8px;
margin-left: 8px;
margin-bottom: 8px;
}

#insidethis h4
{ 
/*Size of the image*/ 
padding-top: 16px; width: 82px;

/*The image*/ 
background-image: url(../med/inside_this.gif); 
background-repeat: no-repeat;

/*Hide the text*/ overflow: hidden; 

/* WIN IE5 hack */ 
height: 16px; 
voice-family: "\"}\""; 
voice-family:inherit; 
height: 0;
margin: 0px; 
}

#insidethis img
{
margin-top: 8px;
margin-bottom: 8px;
}

#questionauthority h4
{ 
/*Size of the image*/ 
padding-top: 16px; width: 143px;

/*The image*/ 
background-image: url(../med/question_authority.gif); 
background-repeat: no-repeat;

/*Hide the text*/ overflow: hidden; 

/* WIN IE5 hack */ 
height: 16px; 
voice-family: "\"}\""; 
voice-family:inherit; 
height: 0;
margin: 0px; 
}

#questionauthority img
{
margin-top: 8px;
margin-left: 8px;
margin-bottom: 8px;
}


#homepage p
{
margin: 0px;
margin-top: 6px;
}

/* ===================== BACK ISSUE PAGE SPECIFIC ===================== */

#backissues
{
margin-left: 10px;
margin-right: 10px;
margin-top: 10px;
}

#backissues p
{
margin-top: 0px;
}

#bicalloutbox
{
float: left;
width: 400px;
background-color: #336699;
color: #ffffff;
padding: 8px;
padding-bottom: 14px;
}

#bicalloutbox p
{
font-weight: bold;
}


#backissues .topleft
{
float: left;
width: 160px;
}

#backissues .topright
{
float: left;
width: 240px;
}

#backissues .left
{
float: left;
width: 120px;
margin-top: 20px;
}

#backissues .right
{
float: left;
width: 260px;
margin-top: 20px;
}

#backissues h3
{
font-weight: bold;
font-size: 100%;
}

/* ===================== TOC PAGE SPECIFIC ===================== */

#toc
{
margin-left: 10px;
margin-right: 10px;
margin-top: 10px;
}

#toc p
{
margin-top: 0px;
}

#toccalloutbox
{
float: left;
width: 400px;
background-color: #336699;
color: #ffffff;
padding: 8px;
padding-bottom: 14px;
margin-bottom: 10px;
}

#toccalloutbox p
{
font-weight: bold;
}


#toc .topleft
{
float: left;
width: 160px;
}

#toc .topright
{
float: right;
width: 230px;
}


#toc .left
{
float: left;
width: 192px;
margin-top: 10px;
margin-bottom: 10px;
margin-right: 10px;
}

#toc .right
{
float: left;
width: 180px;
margin-top: 10px;
margin-bottom: 10px;
}

.sechead
{
font-size: 100%;
color: red;
font-weight: bold;
margin-bottom: 5px;
}

#toc strong
{
font-weight: bold;
clear: both;
display: block;
}

#toc em
{
clear: both;
display: block;
}

/* ===================== STATIC PAGES ===================== */

#staticpage
{
margin-left: 10px;
margin-right: 10px;
}

#staticpage h2
{
color: red;
margin-top: 8px;
margin-bottom: 8px;
font-weight: bold;
font-size:130%;
text-transform: uppercase;
}

#staticpage h3
{
font-weight: bold;
font-size: 100%;
}

#staticpage p
{

}

#staticpage .calloutbox
{
margin-top: 10px;
margin-bottom: 10px;
}

#staticpage .calloutbox h2
{
color: #ffffff;
}

#staticpage .left
{
float: left;
width: 130px;
}

#staticpage .right
{
float: left;
width: 250px;
}

* html #staticpage .left,
{
  margin-top: 8px;  /* for IE5.x/win */
  m\argin-top: 8px;  /* for other IE versions */
}

* html #staticpage .right
{
  margin-top: 8px;  /* for IE5.x/win */
  m\argin-top: 8px;  /* for other IE versions */
}

#staticpage strong
{
font-weight: bold;
clear: both;
display: block;
}

#staticpage img
{
margin-top: 20px;
margin-left: 5px;
margin-bottom: 10px;
}

/* ===================== OVERVIEW PAGES ===================== */

#overviewpage
{
margin-left: 10px;
margin-right: 10px;
}

/* ===================== GLOBAL CLASSES AND ELEMENTS ===================== */

.calloutbox
{
background-color: #336699;
color: #ffffff;
font-weight: bold;
padding: 8px;
}

.big
{
font-size: medium;
}

#featurebox
{
float: left;
width: 400px;
border: 1px #696969 solid;
padding: 7px;
margin-bottom: 10px;
margin-top: 10px;
}

#featurebox h3
{
font-weight: bold;
color: red;
font-size: 100%;
}

#featurebox img
{
padding-top: 8px;
padding-left: 6px;
padding-bottom: 6px;
}

strong
{
font-weight: bold;
clear: both;
display: block;
}

em
{
clear: both;
display: block;
}

.reversecap
{
width:20px;
text-transform: uppercase;
font-size: medium;
font-weight: bold;
color: white;
background-color: black;
padding-left: 6px;
}

/* ================ LINKS AND OTHER LINK TYPE SELECTORS ============ */

a.white:link {
color: #ffffff;
text-decoration: underline
}

a.white:visited {
color: #ffffff;
text-decoration: underline
}

a.white:hover {
background-color:  #ffffff;
color: #2A5680;
text-decoration: underline
}

a.image:link, a.image:visited, a.image:hover, a.image:active
{
text-decoration: none;
}

a:link {
color: #336699;
text-decoration: none
}

a:visited {
color: #336699;
text-decoration: none
}

a:hover {
color:  #336699;
text-decoration: underline
}

a.image:link, a.image:visited, a.image:hover, a.image:active
{
text-decoration: none;
}

/* 

\\\\\\\\\\\\ SPECAIL SECTION FOR CSS MAGIC \\\\\\\\\\\\\\\\\

*/

/* ONION SKIN DROP SHADOW */

.wrap1, .wrap2, .wrap3 {
display:inline-table;
/* \*/display:block;/**/
  }
.wrap1 {
  float:left;
  background:url(../med/shadow.gif) right bottom no-repeat;
  }
.wrap2 {
  background:url(../med/corner_bl.gif) left bottom no-repeat;
  }
.wrap3 {
  padding:0 8px 8px 0;
  background:url(../med/corner_tr.gif) right top no-repeat;
  }
.wrap3 img {
  display:block;
  }