/* -------------------------------------------------------------------------------------

Contents:

1. Reset code
2. General CSS - fonts/headings/paragraphs etc.
3. Anchors
4.  Lists
5. Structure
7. Navigation
8. Miscellaneous classes

-------------------------------------------------------------------------------------*/

/* 1. Reset code - from Eric Meyer http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/ I've removed the em, strong and :focus resets from Eric's code so these will use browser defaults */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, font, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline;}
body {line-height: 1; color: black; background: white;}
ol, ul {list-style: none;}
/* tables still need 'cellspacing="0"' in the markup */
table {border-collapse: separate; border-spacing: 0;}
caption, th, td {text-align: left; font-weight: normal;}
blockquote:before, blockquote:after, q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}

/* 2. General CSS - fonts, headings, paragraphs, etc. */

body {
background: #f0f0f0;
font-size: 62.5%;
line-height: 1.8em;
color: #000;
}

h1, h2, h3, h4, h5, h6{
font-weight: bold;
font-family: helvetica, arial, sans-serif;
padding: 0 9px 0;
}


h1 {
font-size: 2.2em;
margin:  0 0 1.636636em;
}

h2 {
font-size: 1.5em;
margin: 0 0 1.2em;
}

h3 {
font-size: 1.2em;
margin: 0 0 .6em;
}

h4 {
font-size: 1em;
margin: 0 0 .5em;
}

p{
font-size: 1.2em;
margin: 0 0 1.5em;
padding: 0 9px 0;
}

p.standFirst{
color: #333;
font-family: helvetica, arial, sans-serif;
font-size: 1.4em;
font-weight: bold;
margin-bottom: 1.285714285em;
}

p.strapLine{
font-weight: bold;
font-size: 1.6em;
margin: 0 0 1.125em;
}

blockquote p{
color: #5078B4;
font-family: georgia;
font-size: 1.6em;
margin:  0 0 3em;
}

/* 3. Anchors - includes CSS for navigation. */

a:link{
color: blue;
text-decoration: none;
}

a:visited {
color: purple;
text-decoration: none;
}

a:hover {
color: red;
text-decoration: underline;
}

a:active {
color: red;
text-decoration: underline;
}

/* 4. Lists */

ul{
font-size: 1.2em;
list-style: disc outside none;
margin: 0 0 1.5em 13px;
padding-left: 10px;
}

ul.documentIcons{
list-style: none;
margin: 0 0 1.5em 13px;
padding: 0;
}

#content ul.documentIcons li.pdf, #mainContentNoSub ul.documentIcons li.pdf, .subContent ul.documentIcons li.pdf{
background: url(/images/common/docTypes/icon_pdf.gif) 0 .2em no-repeat;
margin: 0 0 .5em;
padding: 0 0 0 20px;
}

#content ul.documentIcons li.word, #mainContentNoSub ul.documentIcons li.word, .subContent ul.documentIcons li.word{
background: url(/images/common/docTypes/icon_doc.gif) 0 .2em no-repeat;
margin: 0 0 .5em;
padding: 0 0 0 20px;
}

#content ul.documentIcons li.excel, #mainContentNoSub ul.documentIcons li.excel, .subContent ul.documentIcons li.excel{
background: url(/images/common/docTypes/icon_xls.gif) 0 .2em no-repeat;
margin: 0 0 .5em;
padding: 0 0 0 20px;
}


/* 5. Structure */

html{
overflow-y: scroll;
}

html, body, #container {
height: 100%;
margin: 0 auto;
position: relative;
}
  
body > #container{
height: auto; 
min-height: 100%;
}
 
#container{
background: #fff;
font-family: tahoma, helvetica, arial, sans-serif;
width: 960px;
}

#content{
/*background: #fff url(../images/linedPaper.png);*/
background: #fff url(../images/whiteBackground.png) repeat-x;
margin: 0 auto;
overflow: hidden;
padding: 3.6em 0 30px; /* Bottom padding needs to be the same as the negative margin of the footer */
width: 960px;
}

#header{
background: #fff;
border-bottom: 5px solid #0F1E37;
height: 95px;
margin: 0 auto;
width: 960px;
}

#societyLogo{
background: #fff url(../images/sesLogoBackground.gif) top right no-repeat;
height: 100px;
margin: 0 auto;
width: 960px;
}

#navigation{
background: url(../images/navigationBar.png) no-repeat;
color: #fff;
font-weight: bold;
height: 21px;
padding: 7px 0;
margin: 0 auto;
width: 960px;
}

#navigationList{
margin: 0 auto;
width: 960px;
}

#navigationList li{
display: inline;
}

#navigationList a:link, #footer a:link{
color: #fff;
text-decoration: none;
}

#navigationList a:visited, #footer a:visited{
color: #fff;
text-decoration: none;
}

#navigationList a:hover, #footer a:hover{
color: #ccc;
text-decoration: none;
}

#navigationList a:active, #footer a:active{
color: #ccc;
text-decoration: none;
}

#home #homeLink, #conferences #conferencesLink, #about #aboutLink, #contact #contactLink, #grants #grantsLink, #journal #journalLink, #members #membersLink , #membership #membershipLink, #projects #projectsLink{
color: #ccc;
}


#banner{
background: url(../images/handsUp2.jpg) no-repeat;
height: 216px;
margin-bottom: 1.8em;
width: 620px;
}

#bannerText{
float: right;
height: 156px;
padding: 30px;
width: 270px;
}

#bannerText p{
color: #fff;
font-size: 1.4em;
padding: 0;
}

#bannerButton{
bottom: 20px;
right: 56px;
height: 46px;
margin: 0 auto;
position: absolute;
}

#recentArticles{
background: #fff;
margin-bottom: 1.8em;
}

#conferences{
margin-bottom: 1.8em;
}

#focus{
background: #f7f7e9;
margin-bottom: 1.8em;
}

.focusBox{
color: #333;
background: #f7f7e9;
border-bottom: 1px solid #ccc;
height: 169px;
padding: 10px;
}

.one, .two, .three, .four, .five, .six, .seven, .eight, .nine, .ten, .eleven, .twelve{
display: inline;
position: relative;
margin: 0 10px 0;
}

.one{
width: 60px;
}

.two{
width: 140px;
}

.three{
width: 220px;
}

.four{
width: 300px;
}

.five{
width: 380px;
}

.six{
width: 460px;
}

.seven{
	width: 540px;
}

.eight{
	width: 620px;
}

.nine{
width: 700px;
}

.ten{
	width: 780px;
}

.eleven{
	width: 860px;
}

.twelve{
width: 940px;
}

#footer{
background: url(../images/footerBackground.png) no-repeat;
clear: both;
color: #fff;
font-size: 1.2em;
height: 25px;
margin: -30px auto 0; /* The negative margin needs to be the sum of the border, height and padding of the footer div. This needs to be the same as the bottom margin on the content div. */
overflow: hidden;
padding: 5px 0 0 0;
position: relative;
text-align: center;
width: 960px;
z-index: 10;
}

/* 6. Navigation CSS - anchor information is above */

/*Contact form*/

#contactForm{
font-size: 1.2em;
margin: 0 0 .6em;
}

form em, em.form{
font-weight: normal;
font-style: normal;
color: #ff0000;
}

fieldset { 
position: relative;
margin: 1.5em 0 0 0;  
padding: 0;
background: #fff;
border: 1px solid #ccc;
}

legend {  
margin-left: 1em;  
color: #000000;  
font-weight: bold;
}

fieldset ol {  
padding: 1em 1em 0 1em;  
list-style: none;
}

fieldset li {  
padding-bottom: 1em;
}

fieldset.submit {  
float: none;  
width: auto;  
border-style: none;  
padding-left: 9em;  
background-color: transparent;
background-image: none;
}

#message
{
overflow: auto;
}

label {
float: left;  
width: 7em;  
margin-right: 1em; 
display: inline;
}

.errorMessage{
color: #ff0000;
display: inline;
}

span.yellow{
color: #30497F;
}
/*label{ for labels above fields 
display: block;
}*/

.formWarning{
background: #f7f7e9;
border: 1px solid #ff0000;
color: #ff0000;
padding: 5px;
text-align: center;
}

/* 7. Miscellaneous classes */

.clear{
clear: both;
}

.clearLeft{
clear: left;
}

.center{
text-align: center;
}

.left{
float: left;
}
 
.right{
float: right;
}

.imageLeft{
margin-right: 0.5em;
margin-bottom: 1.285714285em;
}

.imageRight{
margin-left: 0.5em;
margin-bottom: 1.285714285em;
}

.frame{
background: #eee;
border: 2px solid #ccc;
padding: 3px;
}

.blue{
color: #248EA9;
}

.marginRight{
margin-right: 5em;
}



/* clear fix - this is for the sticky footer. see www.cssstickyfooter.com/ for more info */
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */