/*** General default settings first ***/
* { margin: 0; padding: 0; }

h1, h2, h3, h4, h5, h6, pre, p, blockquote, ul, ol, dl, fieldset, address { margin: .5em 12px; }
li, dd { margin-left: 12px; }

img { border: 0; }

a:link { color: #000066; font-weight: 700; text-decoration: none; }
a:visited { color: #660066; font-weight: 700; text-decoration: none; }
a:hover, a:focus, a:active { color: #CC0000; font-weight: 700; text-decoration: none; }

/*** Getting consistent text sizes across browsers (IE5) ***/
body { font-size: 80%; } /* Resets 1em to 12px - more or less. */

h1 { font-size: 187.5%; font-weight: 400; }
h2 { font-size: 150%; font-weight: 400; }
h3 { font-size: 125%; font-weight: 700; }
h4 { font-size: 100%; font-weight: 700; }
h5 { font-size: 87.5%; font-weight: 700; }
h6 { font-size: 80%; font-weight: 400; }
/* Headers sized taking body font-size into account to give equivalent to 150%, 120%, 100%, 80%, 70%, 64%. */

pre { font-size: 100%; } /* To stop pre text being too small */

body {
margin: 0;
padding: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
background-color: #eeeeee; 
word-spacing: 0.1em;
text-align: center; /* To center the page in IE */
padding-top: 1em;
padding-bottom: 1em;
}

/*** Layout stuff ***/
.centerpage {
width: 90%;
margin: 0 auto; /* To center the page */
text-align: left;
color: #222222;
background-color: #e9ddcf;
border: 1px solid #999999;
min-width: 740px;
max-width: 1100px;
}

.header {
background-image: url(../images/afi-logo.jpg);
background-position: 12px 8px;
background-repeat: no-repeat;
border-bottom: 1px solid #999999;
}

.menu {
margin: 58px 12px 0 24px;
color: #333333; 
}
.menu a:link, .menu a:visited { color: #333333; }
.menu a:hover, .menu a:focus, .menu a:active { color: #CC0000; }

.mainbox {
background-color: #f4f4e1;
line-height: 1.4;
padding: 1em 24px; /* top and bottom to trigger enclosure of margins in firefox */
}
.mainbox h3, .mainbox h4 { margin-top: 1.5em; margin-bottom: 0; }  /* Nice for sub-headings */
.mainbox h2 { margin-top: 0; } /* Use for the first heading in .mainbox */

/* A hack to stop IEwin breaking the layout if a floated right element reaches the bottom in .mainbox */
/* Hide hack from IEmac \*/
* html .mainbox {height: 1%;}
/* End hide hack from IEmac */

.footer {
padding: .5em 12px .5em 24px;
border-top: 1px solid #999999;
}
.footer img { margin-top: .3em; }
.footer h6 { padding-top: .5em; margin-top: 0; }

/* Hide hack from IEmac \*/
* html .footer {height: 1%;}
/* End hide hack from IEmac */

.rightbox { /* needs .mainbox { position: relative; etc } inline on about.html */
position: absolute;
right: 36px;
top: 24px;
}

/*** Simple floats ***/
.floatleft { float: left; }
.floatright { float: right; }

/*** Floats for images ***/
.imageright {
float: right;
clear: right;
margin: 0 12px 0 24px;
}

.imageleft {
float: left;
clear: left;
margin: 0 24px 0 12px;
}

/****** Image styling ******/
.mainbox img { 
padding: 4px; 
border: 1px solid #cccccc; 
}

.portfolioimage {
float: left;
margin: 12px;
font-family: Georgia, Utopia, Palatino, 'Palatino Linotype', serif;
text-align: center;
width: 198px;
}
.portfolioimage img { margin-top: 6px; }

.captioned {
float: left;
font-family: Georgia, Utopia, Palatino, 'Palatino Linotype', serif;
text-align: center;
}
.captioned .imglayout { margin-bottom: 0; }

.imglayout { 
margin: 12px; 
vertical-align: middle;
}

.noimgborder { 
padding: 0 !important; 
border: none !important;
}

.margin-bottom { margin-bottom: 12px; }

/*** Miscellaneous bits and bobs ***/
.skip {
height: 0;
width: 0;
overflow: hidden;
}
/* Hide hack from IEmac \*/
* html .skip {height: 1px;}
/* End hide hack from IEmac */

.crowtextleft { 
font-family: Georgia, Utopia, Palatino, 'Palatino Linotype', serif;
font-size: 125%;
line-height: 1.6;
width: 670px;
float: left;
}

.crowtextright { 
font-family: Georgia, Utopia, Palatino, 'Palatino Linotype', serif;
font-size: 125%;
line-height: 1.6;
width: 670px;
float: right;
}

.spacer { clear: both; }
.clearleft { clear: left; }
.center { text-align: center; }

/*** Form styling ***/
fieldset { 
border: none;
margin-top: 1em; 
margin-bottom: 0;
}

textarea { width: 70%; }
input, textarea { margin-bottom: 1em; margin-right: 1em; }
input:focus, textarea:focus { background-color: #eeeecc; }

label {
display: block;
float: left;
width: 7em;
text-align: right;
margin-right: 1em;
}

.formbuttons { margin-left: 9em; }